ngbTabset не обновляет вкладку программно - PullRequest
Новая
       20

ngbTabset не обновляет вкладку программно

0 голосов
/ 17 декабря 2018

Я пытаюсь активировать вкладку программно (не по умолчанию активно) через ngbTabset.select (), но она не работает. 

<ngb-tabset #ctdTabset="ngbTabset">
     <ngb-tab id="tab1">
       <ng-template ngbTabTitle>
         <div (click)="loadView('tab1')">
            <span>Tab 1</span>
         </div>
       </ng-template>
       <ng-template ngbTabContent>
         // tab 1 content here
       </ng-template>
   </ngb-tab>
   <ngb-tab id="tab2">
       <ng-template ngbTabTitle>
         <div (click)="loadView('tab2')">
            <span>Tab 2</span>
         </div>
       </ng-template>
       <ng-template ngbTabContent>
         // tab 2 content here
       </ng-template>
   </ngb-tab>
 </ngb-tabset> 

 // component.ts
 export class DashboardComponent implements OnInit {
   @ViewChild('ctdTabset') ctdTabset;

   ngOnInit() {
     this.switchNgBTab('tab2');
   }

   switchNgBTab(id: string) {

     this.ctdTabset.select(id);
   }
 }

Не обновляется tab2, может быть, я сделал что-то не так.Пожалуйста, кто-нибудь может мне помочь.Ваша доброта будет оценена.Благодарю.

1 Ответ

0 голосов
/ 17 декабря 2018

Использовать ngAfterViewInit .Вызовите switchNgBTab() из ngAfterViewInit вместо ngOnInit()

 import {Component, ViewChild} from '@angular/core';

@Component({
  selector: 'ngbd-tabset-basic',
  templateUrl: './tabset-basic.html'
})
export class NgbdTabsetBasic { 

  @ViewChild('ctdTabset') ctdTabset;

  ngOnInit() {}

  ngAfterViewInit() {
    this.switchNgBTab('tab2');
  }

   switchNgBTab(id: string) {
     this.ctdTabset.select(id);
   }
}

Ссылка на stackBlitz: https://stackblitz.com/edit/angular-reywga-s9hh6v?file=app/tabset-basic.ts

...