Topic: select tab index initially
Can't I select active tab on ngOnInit()?
HTML:
@ViewChild('staticTabs') staticTabs: TabsetComponent;
ngOnInit() {
this.staticTabs.setActiveTab(2);
}
because I am getting an error
ERROR TypeError: Cannot read property 'setActiveTab' of undefined
Dear She Jong Shon,
The @ViewChild decorator is available to use after rendering the page, not in initializing part.
So please use it in the ngAfterViewInit() lifecycle instead of ngOnInit(), and everything will be working fine.
Best Regards,
Damian
natenoctel commented 4 years ago
I have the same issue, when I console.log(this.staticTabs) it comes back as undefined inside of ngAfterViewInit()
hey, my code is
ngAfterViewInit() {
this.caseTabs.setActiveTab(1);
this.caseTabs.tabs[0].disabled = true;
this.caseTabs.tabs[2].disabled = true;
}still, the active tab does not get set and it shows the deactivated tab [0]. might this error be related to the last mdb version update?
4ntibala pro commented 6 years ago
for those who are struggling to...
this.caseTabs.click(Event.AT_TARGET, 1);
will bring u closer..
Dear @4ntibala
I don't think, that this problem is related to the latest MDB Angular update, but feel free to download some older version, and test.
I have added this problem to our bugs list, and we'll fix it.
Best Regards,
Damian
4ntibala pro commented 6 years ago
i faced the same prob with 6.3.0 so a fix would be really good..
can u help me out with my workaround? i am selecting the tab via
this.caseTabs.click(Event.AT_TARGET, 1);
but like this the
(getActiveTab)="onTabChange($event)
does not get triggered. what could i pass to the .click function in order to imitate a tab activation?
Thanks
Dear @4ntibala
Could you please explain one more time, what do you want to achieve?
I think that I didn't understand you good.
Best Regards,
Damian
I have the same problem. It was because my tabset add tabs with an *ngFor directive and it waits a callback. I fix it with a 900ms setTimeout()
ngAfterViewInit(): void { setTimeout(() => { this.userTabSet.setActiveTab(1); }, 900); }
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Resolved
- User: Free
- Premium support: No
- Technology: MDB Angular
- MDB Version: 6.2.3
- Device: desktop
- Browser: chrome
- OS: windows 10
- Provided sample code: No
- Provided link: No