Angular2 Material 访问选项卡值

标签 angular angular-material angular2-material

我有以下代码:

<md-tab-group (selectChange)="doSomething()">
  <md-tab *ngFor="let p of something))">
    <template md-tab-label>
     {{p.name}} ...
    </template>
   </md-tab>
 </md-tab-group>

现在 doSomething() get 在 Tab-Change 上触发,我可以访问选定的索引,但是有什么方法可以访问我的 *ngFor 循环的值吗?我需要在代码中使用“p.id”来从数据库中获取数据,具体取决于打开的选项卡。 还是有我没有想到的更优雅的解决方案?感谢您的帮助:)

最佳答案

我通过将 $event 发送到函数来解决这个问题

<md-tab-group #tabs (selectChange)="myFunction($event)">
    <md-tab label="My label" data-my-value="123">
        ...
    </md-tab>
    ...
</md-tab-group>

然后从该对象获取值

myFunction($event: any) {
    let myValue = $event.tab.content.viewContainerRef.element.nativeElement.getAttribute('data-my-value');
}

关于Angular2 Material 访问选项卡值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41151009/

相关文章:

Angular mat-option 多个值

不同固定大小项目的 Angular 虚拟滚动策略

angular - 使用 angular2-material 组件在 angular2.0 中运行 ng 测试时测试用例失败

angular - stroke-dasharray 无法与 Angular 6 绑定(bind)

java - Angular 调用 java web API 中 http.post 的参数传递

带有验证的 Angular Material 2 垂直步进器并转到下一步

Mat-Menu 上 Angular-Material 的 Angular Testing

javascript - 如何在 Angular 可见时刷新组件

angular - 在 @angular/core 中放置导入库的最佳实践是什么

angular - 找不到名称 'HammerManager'