Una forma es usar variables de plantilla con @ViewChildren()

 <tr #myVar *ngFor="let d of data.results | filter:filterText | pagination:resultsPerPage:currentPage">

 @ViewChildren('myVar') createdItems; ngAfterViewInit() { console.log(this.createdItems.toArray().length); }

Encontré que la solución más simple es la siguiente:

1. En su componente: agregue un campo que contendrá el conteo actual

 filterMetadata = { count: 0 };

2. En su plantilla: agregue filterMetadata como un parámetro a la tubería de filtro

 <tr *ngFor="#d of data.results | filter:filterText:filterMetadata | pagination:resultsPerPage:currentPage">

3. interpole filterMetadata.count en el elemento que muestra el número de registros mostrados.

 <span> {{filterMetadata.count}} records displayed</span>

4. En la tubería de filtro, actualice el campo filterMetadata.count cuando termine con el filtrado

 transform(items, ..., filterMetadata) { // filtering let filteredItems = filter(items); filterMetadata.count = filteredItems.length; return filteredItems; }

Esta solución todavía usa canalizaciones puras, por lo que no hay degradación del rendimiento. Si tiene varias tuberías que filtran, filterMetadata debe agregarse como parámetro a todas ellas porque angular deja de llamar a la secuencia de tuberías tan pronto como una tubería devuelve una matriz vacía, por lo que no puede simplemente agregarla a la primera o última tubería de filtrado.

Ese no es exactamente el propósito de la pregunta original, pero también estaba buscando una manera de mostrar el recuento de elementos una vez que se hayan aplicado todas las tuberías. Al combinar el índice y los últimos valores proporcionados por ngFor, encontré esta otra solución:

 <div *ngFor="#item of (items | filter); #i = index; #last = last"> ... <div id="counter_id" *ngIf="last">{{index + 1}} results</div> </div>