Angular 多个管道同时处于角度2

我正在做一个Angular 2项目

我有一个多栏的表格。每一列都有不同的排序逻辑（数字、string.lowercase、amountValue in%和INR）。行根据该列的排序逻辑进行排序。为了实现这一点，我使用了一个名为sortTable的自定义管道，它几乎没有参数

同时，顶部有一个与searchTerm变量绑定的输入字段。为了使用searchTerm过滤数据，我使用了另一个名为sortTableRow的自定义管道

虽然非常复杂，但非常简化的代码段可以是：

<input type="search" [(ngModel)]="searchTerm"/>

<table>
  <thead>
    <tr class="sortable-header">
        <th data-key="status" data-dt="boolean">Status</th>
        <th data-key="name" data-dt="string">Name</th>
        <th data-key="code" data-dt="string">Code</th>
        <th data-key="amountValue" data-dt="amount">Amount</th>
    </tr>
  </thead>
  <tbody>
    <tr *ngFor="let row of rows | sortTable: sortType : {'key': key, 'dt': dt} | searchTableRow : searchTerm : ['name']">
        <td> {{row.status}} </td>
        <td> {{row.name}} </a> </td>
        <td> {{row.code}} </td> 
        <td> {{row.amountValue}} </td>
    </tr>
  </tbody>
</table>

地位
名称
代码
数量
{{row.status}}
{{row.name}
{{row.code}}
{{row.amountValue}}

两条管道各自工作良好。当我单击列标题时，click事件处理程序上的key和dt（数据类型）会发生变化，行也会相应地排序。当我搜索一个词时，结果会被过滤，我会看到所需的输出

---

但是，当我尝试对过滤后的结果进行排序（按searchTerm）时，什么也没有发生。我认为在这种情况下，两个管道不能同时工作。我不想移除这些管道。

嗯。。。很奇怪。这有帮助吗

<tr *ngFor="let row of (rows | sortTable: sortType : {'key': key, 'dt': dt}) | searchTableRow : searchTerm : ['name']">

---

如果没有，请尝试在每个管道中设置console.log并观察它们返回的内容，因为您首先对列表进行排序，然后应用筛选。 要解决这个问题，只需在html代码中对管道进行排序之前移动过滤管道即可

`<tr *ngFor="let row of (rows | searchTableRow : searchTerm : ['name']) | sortTable: sortType : {'key': key, 'dt': dt}">`

``

您可以使用管道标志应用管道。 像

这里我用两根管子。 一种是带传递值的calles过滤器 第二个是itemdisplayno。

---

基本上，首先应用带有pass值的筛选器，然后运行itemdisplayno。

是否尝试先调用sortTableRow，然后调用sortTable？你的控制台有错误吗？这里有一个片段可以帮助您快速阅读！但是没有起作用。控制台并没有显示错误。我不认为这种方法，使用管道进行排序是一个好主意。您应该在组件中注意这一点，不要使用管道，我认为此设置将在每个检测周期中进行过滤。过滤器应只进行一次，而不是以这种方式设置。但是，如果您决定这样做，祝您好运。对于纯管道，每次更改数据或过滤器参数时，只会调用一次过滤器函数，而且不会再调用。因为纯管道结果必须只依赖于它的参数。