Holiday Notice: Support will be provided on a limited scale from December 24th, 2024, to January 2nd, 2025. Happy holidays and a wonderful New Year!


Topic: select tab index initially

She Jong Shon free asked 6 years ago


Can't I select active tab on ngOnInit()?

HTML:

<mdb-tabset #staticTabs...>
 
TS:

@ViewChild('staticTabs') staticTabs: TabsetComponent;

ngOnInit() {

    this.staticTabs.setActiveTab(2);
}

because I am getting an error

ERROR TypeError: Cannot read property 'setActiveTab' of undefined


JavierSF free answered 4 years ago


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); }


Damian Gemza staff answered 6 years ago


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


Damian Gemza staff answered 6 years ago


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


4ntibala pro answered 6 years ago


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..

Damian Gemza staff answered 6 years ago


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 free commented 4 years ago

I have the same issue, when I console.log(this.staticTabs) it comes back as undefined inside of ngAfterViewInit()



Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Resolved

Specification of the issue

  • ForumUser: 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
Tags