JavaScript UI Libraries & Blazor Components Suite – Smart UI › Forums › Docking Layout › Programmatically inserted LayoutPanelItems are not draggable › Reply To: Programmatically inserted LayoutPanelItems are not draggable
Hi Yavor
I tried your solution and strangely it only works partially.
ngAfterViewInit(): void {
//A
const smartDockingLayout: DockingLayoutComponent = this.docking as DockingLayoutComponent; smartDockingLayout.layout[0].items[0].items.push(this.tabsWindowObject)
this.tabService.tabsChanged$.subscribe((t) => {
//B
const smartDockingLayout: DockingLayoutComponent = this.docking as DockingLayoutComponent; smartDockingLayout.layout[0].items[0].items.push(this.tabsWindowObject)
})
}
I have an obserable, and if it changes I add a new tab based on the changes.
I marked the two cases, ‘A’ works properly. ‘B’ works if it triggers immediately when I subscribe to the observable. But when I trigget the observable later, the layout changes and the tab is in there (console.log verifies this) but the docking layout UI won’t update with the new tab.
I also tried:
ngAfterViewInit(): void {
setInterval(()=>{
const smartDockingLayout: DockingLayoutComponent = this.docking as DockingLayoutComponent; smartDockingLayout.layout[0].items[0].items.push(this.tabsWindowObject)
})
}
And this won’t work either, the new tab is not visible on the ui, but it is in the ‘smartDockingLayout.layout’ if I log it.