我知道我可以在 Angular 4 中对管道输出进行别名,但这仅在别名的模板内有用。
Example
<div *ngIf="race | async as raceModel">
<h2>{{ raceModel.name }}</h2>
<small>{{ raceModel.date }}</small>
</div>
这里raceModel不能在ngIf之外引用。就我而言,我正在使用管道订购和过滤集合,并希望在过滤后获取返回集合的长度,以便我可以更新我的 NgbPagination。
我的代码:
<tr *ngFor="let cust of customers | filterBy: searchFilters: true | orderBy: order: reverse: true: start: end as collection">
<td>{{cust.id}}</td>
</tr>
</tbody>
</table>
<ngb-pagination *ngIf="customers"
(pageChange)="pageChange($event)"
[collectionSize]="collection.length"
[(page)]="page"
[(pageSize)]="pageSize"
[maxSize]="5"
[rotate]="true"
[ellipses]="true"
[boundaryLinks]="true">
</ngb-pagination>
如果可以避免的话,我不想将管道拖到视图模型中。有关如何保护管道中的变量以便以后在视图中使用的任何提示?
目前我已采取以下措施:
<ngb-pagination *ngIf="customers"
(pageChange)="pageChange($event)"
[collectionSize]="(customers | filterBy: searchFilters: true: true)"
[(page)]="page"
[(pageSize)]="pageSize"
[maxSize]="5"
[rotate]="true"
[ellipses]="true"
[boundaryLinks]="true">
</ngb-pagination>
其中过滤器管道的第二个 true 参数返回过滤后的数组的长度而不是过滤后的数组本身。哈克但工作得很好。
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)