使用Angular4（初始化数据表）从单击事件的特定选项卡转到另一个选项卡

我正在使用Angular4创建一个应用程序，在该应用程序中，我需要使用选项卡内的按钮单击事件在选项卡之间导航。初始化Datatable单击事件导航到另一个选项卡

tabsSample.html

<md-tab-group class="custom-tab helper-top-margin" (selectedIndexChange)="selectedIndexChange($event)" [selectedIndex]="selectedIndex">
    <md-tab>
        <tab1></tab1>
    </md-tab>
    <md-tab>
        <span>
            <p-tabView orientation="left" class="custom-vertical-tab">
                <p-tabPanel header="Tab 2" [selected]="true">
                    <tab2></tab2>
                </p-tabPanel>
                <p-tabPanel header="Tab 3">
                    <tab3></tab3>
                </p-tabPanel> 
            </p-tabView>
        </span>
    </md-tab>
</md-tab-group>

tab1.html

<p-dataTable [value]="cars" selectionMode="single" [responsive]="true" class="fixed-datatable-width small-text">
    <p-column header="">
        <ng-template let-car="rowData" pTemplate="body">
            <a (click)="clickMe(car)" md-suffix class="helper-search-icon datatable-primary-icon">
                <md-icon>search</md-icon>
            </a>
        </ng-template>
    </p-column>
</p-dataTable>

@Component({
  selector: 'tab1',
  templateUrl: './tab1.html',
})
export class Tab1 {
  cars: Car[];

    constructor(private carService: CarService) { }

    ngOnInit() {
        this.carService.getCarsSmall().then(cars => this.cars = cars);
    }

  clickMe(event: any){
    this.selectedIndex=event;
  }

}

搜索
@组成部分({
选择器：“tab1”，
templateUrl:“./tab1.html”，
})
导出类Tab1{
汽车：汽车[]；
构造函数（私有carService:carService）{}
恩戈尼尼特（）{
this.carService.getCarsSmall（）.then（cars=>this.cars=cars）；
}
单击我（事件：任何）{
此.selectedIndex=事件；
}
}

我正在使用选择器加载子选项卡。因此，如果单击子选项卡，我需要从一个选项卡导航到主选项卡的另一个选项卡，我不明白您的意思。详细说明..当用户单击Priming datatable中的某一行时，我需要根据所选行将其导航到material选项卡和sub选项卡p-tabview。“材料”选项卡是一个独立的组件，“打底表”也是一个加载在第一个“材料”选项卡中的组件。请使用您期望的屏幕截图更新您的帖子

<p-dataTable [value]="cars" selectionMode="single" [responsive]="true" class="fixed-datatable-width small-text">
    <p-column header="">
        <ng-template let-car="rowData" pTemplate="body">
            <a (click)="clickMe(car)" md-suffix class="helper-search-icon datatable-primary-icon">
                <md-icon>search</md-icon>
            </a>
        </ng-template>
    </p-column>
</p-dataTable>

@Component({
  selector: 'tab1',
  templateUrl: './tab1.html',
})
export class Tab1 {
  cars: Car[];

    constructor(private carService: CarService) { }

    ngOnInit() {
        this.carService.getCarsSmall().then(cars => this.cars = cars);
    }

  clickMe(event: any){
    this.selectedIndex=event;
  }

}