Angular 角度2*Ng，用于循环外的项目计数

我是angular方面的新手，我有一个愚蠢的问题，如何显示*ngFor循环之外的实际项目数

我使用的是这样的过滤器和分页管道

*ngFor=“let item of items | filterBy:['name'，'category']：queryString | paginate:config；let i=index；let c=count”

---

我知道有一个变量“count”，但当然它只在该循环中可用，我如何在组件中获取该变量，我需要创建新组件，将其放入该循环并通过指令传递“count”，还是有更简单、更干净的方法？

使用RxJS主题对我来说很有效

在组件中，创建一个变量来保存计数，即

filterCount

，并为type

number

创建一个RxJS

主题。
让
订阅
取消订阅
OnDestroy上的
可观察

filterCount = 0;
filteredCountSubject = new Subject<number>();
subscription: Subscription;

在模板中，您可以使用
filterCount
在模板中的任何位置显示计数。使用

<div>{{filterCount}}</div>

在
transform
方法的
filterBy
管道中，执行
filteredCountSubject。下一步是使用已过滤数组的计数。i、 e

transform(items: Array<any>, filterConfig: FilterCofig): Array<any> {
    // Arguments sent from HTML.
    const args = arguments;

    // CODE TO FILTER ITEMS BASED ON PARAMETERS.

    // Get the "filterredCountSubj" from arguments.
    // Remember that the argument index of "filteredCountSubject" is 3. As "items" is first argument.
    const filterredCountSubj = args[3];
    if (filterredCountSubj) {
        filterredCountSubj.next(items.length);
    }
    return items;
}

transform（项：数组，过滤器配置：过滤器配置）：数组{
//从HTML发送的参数。
常量args=参数；
//根据参数筛选项目的代码。
//从参数中获取“FilterredCountSubh”。
//请记住，“filteredCountSubject”的参数索引是3。因为“items”是第一个参数。
常量filterredcountsubc=args[3]；
if（filterredcountsubc）{
FilterredCountSubc.next（items.length）；
}
退货项目；
}

希望有帮助。
获取其长度并将其保存在变量中并使用它？应避免使用过滤管。改为在控制器中进行筛选，并将其保存到显示的变量中。您可以只显示该数组的长度。您有一个问题，因为您正在使用管道来操作数据。不要这样做。业务逻辑属于您的代码。嗯。。但是管道很酷：）好的。将过滤移到组件可能是一个很好的解决方案，我同意不使用过滤管的建议。文件中也提到了这一点：）这对我来说非常有效，谢谢！通过异步管道化主题，而不是将计数存储在单独的属性中，我可以稍微简化它
<div *ngFor="let item of items| filterBy: ['name','category']: queryString: filteredCountSubject  | paginate: config; let i = index; let c = count"></div>

transform(items: Array<any>, filterConfig: FilterCofig): Array<any> {
    // Arguments sent from HTML.
    const args = arguments;

    // CODE TO FILTER ITEMS BASED ON PARAMETERS.

    // Get the "filterredCountSubj" from arguments.
    // Remember that the argument index of "filteredCountSubject" is 3. As "items" is first argument.
    const filterredCountSubj = args[3];
    if (filterredCountSubj) {
        filterredCountSubj.next(items.length);
    }
    return items;
}