Question

我有一个Angular应用程序，基本上是一个提交多个标签的组件。第一个选项卡提交请求，然后填充2个表，每个表位于单独的选项卡上。我在每张桌子上使用MdSort，MdPaginator和过滤器等材质函数。根据Angular的文档，您可以选择mdSort元素，如下所示：

@ViewChild(MdSort) sort: MdSort;

html是

<md-table id="datatable" #datatable [dataSource]="resultDataSource" mdSort>

如果组件中只有一个表，这可以正常工作，但由于我有2个表，如何正确选择每个表的排序元素以提供给数据源？如果答案是为每个表使用单独的组件，如何将结果数据传递给其他组件中的数据源？

Answer 1

我最终通过将每个选项卡（以及每个表）的内容移动到具有自己的数据源的自己的组件中来解决此问题。请求组件html使用子组件的选择器，如下所示：

<md-tab label="Results">
  <md-card class="datacard resultscard">
    <md-card-content>
      <app-result></app-result>
    </md-card-content>
  </md-card>
</md-tab>

<md-tab label="Alerts">
  <md-card class="datacard resultscard">
    <md-card-content>
      <app-alert></app-alert>
    </md-card-content>
  </md-card>
</md-tab>

然后在请求组件中，我使用ViewChild

引用了子组件

@ViewChild(RequestComponent) resultsChild: ResultComponent;
@ViewChild(AlertComponent) alertsChild: AlertComponent;

然后调用我在每个组件中包含的方法，将请求返回的数据发送到这些组件，以便将它们添加到各自表的数据源中。我没有真正回答原来的问题，但这是我需要完成的解决方法。

在同一组件中使用mdSort的Angular Multiple md-table

1 个答案: