angular - Angular 6 ngFor 在切片管道之前计数

Question

我有一个带有自定义管道和标准切片管道的 *ngFor：

<div *ngFor="let offer of offerListData | slice:0:propertyLimit | offerFilter: countyId: cityId as filtered; let i = index; let propCount = count"><p>Offer id = {{offer.Id}}</p></div>

这工作正常，但是否有可能在切片管道启动之前获取 offerListData 的长度？

我希望的结果是：

报价计数 = 4

优惠 ID = 1

优惠 ID = 2

优惠 ID = 3

报价 ID = 4

我应该将计数器从我的管道传递到组件，如果是，如何？

编辑：

感谢@JB Nizet，我看到我的问题非常令人困惑，所以我尝试澄清我想要的

在我的 *ngFor 中，我有一个名为 offerListData 的自定义管道，在过滤了县和市之后，我在其中列出了我的报价

我只想显示前 5 个优惠并有一个按钮来加载其余的（我已经修复了此功能）

为了管理我使用默认的切片管道

问题是我想显示在我的自定义管道之后我得到了多少报价，而不是在切片管道之后

如果我使用它，我会在我的自定义管道之前获得报价总数：offerListData.length

如果我使用filtered.length，我只会在我的自定义管道和切片管道之后获得报价的数量

我真正想要的是在我的自定义管道之后显示报价总数。首选是这样的：

<p>Total number of offers: 4</p>
<div *ngFor="let offer of offerListData | slice:0:propertyLimit | offerFilter: countyId: cityId as filtered;">
    <p>Offer id = {{offer.Id}}</p>
</div>

在“报价总数”中使用的管道中设置“计数”参数会更好吗？甚至可以将参数从管道发送到视图或组件吗？

编辑2：我找到了一个修复，不知道这是否是最好的方法，但这有效：

我在我的 ngFor 之外添加了一个 div 元素，id 为 offerCounter

在管道中我使用了这个：

document.getElementById('offerCounter').innerHTML = this.resultFromFilter.length.toString();

标签： angular