如何設置PrimeNG tabMenu中的活動標籤？

Question

我在哪裏聲明activeIndex以及如何使用這個變量？

我 HTML文件：

<p-tabMenu [model]="tabMenuItems"></p-tabMenu> 

和打字稿文件：

tabMenuItems: MenuItem[]; 
private stateId: number; 
private id: number; 
... 
ngOnInit() { 
    this.tabMenuItems = [ 
     {label: 'Bar1', icon: 'ui-icon-insert-chart', 
      command: (event: any) => { 
       this.router.navigate(['/#', 
      this.id],{ queryParams: {'stateId': this.stateId} }); } 
     }, 
     {label: 'Bar2', icon: 'ui-icon-date-range', 
      command: (event: any) => { 
       this.router.navigate(['/#', this.id],{ queryParams: {'stateId': this.stateId} }); } 
     }, 
     {label: 'Bar3', icon: 'ui-icon-book', 
      command: (event: any) => { 
       this.router.navigate(['/#', this.id], 
        { queryParams: {'stateId': this.stateId} }); } 
     }, 
     {label: 'Bar4', icon: 'ui-icon-help-outline', 
      command: (event: any) => { 
       this.router.navigate(['/#', this.id], 
        { queryParams: {'stateId': this.stateId} }); } 
     }, 
     {label: 'Bar5', icon: 'ui-icon-public', 
      command: (event: any) => { 
       this.router.navigate(['/#', this.id], 
        { queryParams: {'stateId': this.stateId} }); } 
     } 
    ]; 

我怎麼可以設置的活動標籤，所以每個菜單項激活相應的選項卡？

Answer 1

Documentation

在tabMenu設置[activeItem]財產。

例

ngOnInit() { 
    this.tabMenuItems = [ 
     {label: 'Bar1', icon: 'ui-icon-insert-chart', 
      command: (event: any) => { 
       this.router.navigate(['/#', 
      this.id],{ queryParams: {'stateId': this.stateId} }); } 
     }, 
     {label: 'Bar2', icon: 'ui-icon-date-range', 
      command: (event: any) => { 
       this.router.navigate(['/#', this.id],{ queryParams: {'stateId': this.stateId} }); } 
     }, 
     {label: 'Bar3', icon: 'ui-icon-book', 
      command: (event: any) => { 
       this.router.navigate(['/#', this.id], 
        { queryParams: {'stateId': this.stateId} }); } 
     }, 
     {label: 'Bar4', icon: 'ui-icon-help-outline', 
      command: (event: any) => { 
       this.router.navigate(['/#', this.id], 
        { queryParams: {'stateId': this.stateId} }); } 
     }, 
     {label: 'Bar5', icon: 'ui-icon-public', 
      command: (event: any) => { 
       this.router.navigate(['/#', this.id], 
        { queryParams: {'stateId': this.stateId} }); } 
     } 
    ]; 

    this.activeTab = this.tabMenuItems[1]; 
} 

在HTML

<p-tabMenu [model]="tabMenuItems" [activeItem]='activeTab'></p-tabMenu>