Angular 4：存储管道输出变量以在模板外部使用

Question

我知道我可以在 angular 4 中为管道输出添加别名，但这仅在使用别名的模板中有用。

示例

<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>

如果可以避免，我不想将管道拖到视图模型中。关于如何从管道保护变量以供以后在视图中使用的任何提示？

Answer 1

目前我已经完成了以下操作：

<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>

过滤管道的第二个真实参数returns过滤数组的长度而不是过滤数组本身。 Hacky 但工作正常。

Angular 4：存储管道输出变量以在模板外部使用

Angular 4: Store pipe output variable for use outside of template

angular-pipe

angular