To access the filtered results of the pipe just define it as a variable via the as keyword
*ngFor="let bookmark of bookmarks | bookmarkFilter: filterText as filteredBookmarks"
In the full example the bookmarkFilter pipe filters the list of bookmarks based on some text search. Further I need to check whether the filtered results contain only one element [showMoreText] = "filteredBookmarks.length === 1 ", to then display the full content of the bookmark:
<div class="mt-3" *ngFor="let bookmark of bookmarks | bookmarkFilter: filterText as filteredBookmarks">
<app-bookmark-list-element
[showMoreText] = "filteredBookmarks.length === 1 || bookmarks.length === 1"
[bookmark]="bookmark"
[userData$]="userData$"
[queryText]="queryText"
[filterText]="filterText"
[isSearchResultsPage]="isSearchResultsPage"
>
</app-bookmark-list-element>
</div>
See it in action at www.codever.land:
The source code for Codever is available on Github
Shared with ❤️ from Codever. Use 👉 copy to mine functionality to add it to your personal snippets collection.
Top comments (0)