How to filter an Angular list on the fly
In AngularJs, ng-repeat had a filter option. That is gone in the new Angular.
Instead, create a function that will accept a list and return the filtered version, like this:
myFilter(list:any[]):any[]{
return list.filter(p=>p.Id > 0);
}
Then, bind your repeating control to that function instead of the regular list, like this:
<div *ngFor="let l of myFilter(myDataSet)">{{l}}</div>
Now, the div will be filtered automatically!
An issue I ran into was that this technique, when used on an Angular Slickgrid, caused hyperlinks to stop working. Clicking on them just made the grid shake. As a workaround, I assigned a second array to the result of this function, updated it on any filter change, and bound the grid to that array.
Created By: amos 8/24/2023 11:31:28 AM
Updated: 8/24/2023 1:44:06 PM
|
|