我有一个角度应用程序,显示以下示例数据:
samples = [
{ 'user': 'trump', 'rank': 36, 'active': true },
{ 'user': 'fred', 'rank': 30, 'active': false },
{ 'user': 'luke', 'rank': 47, 'active': true },
{ 'user': 'hillary', 'rank': 44, 'active': false },
{ 'user': 'bernie', 'rank': 36, 'active': true },
{ 'user': 'john', 'rank': 40, 'active': false },
{ 'user': 'pebbles', 'rank': 1, 'active': true }
];
我想做的是使用lodash
来过滤客户端中的排名。我的过滤器允许我过滤大于或小于的排名。以下是过滤器:
在component.ts
中:
.... other necessary codes....
ngOnInit() {
this.sampleService.loadAllSamples().subscribe(filteredSamples => {
this.filteredSamples = filteredSamples;
this.applyFilters();
});
}
private applyFilters() {
this.filteredSamples = _.filter(this.samples, _.conforms(this.filters));
}
filterGreaterThan(property: string, rule: number) {
this.filters[property] = val => val > rule;
this.applyFilters();
}
filterLessThan(property: string, rule: number) {
this.filters[property] = val => val < rule;
this.applyFilters();
}
在我的html模板中,我具有等级过滤器,该过滤器使我可以获得高于输入值的等级。
<input type="number" id="rank" name="rank" [(ngModel)]="rank" (change)="filterGreaterThan('rank', rank)">
到目前为止,一切都按预期进行。我显示了经过过滤的数据(在这种情况下,大于)。
我想做的是像上面一样添加另一个过滤。这应该允许我像等级范围一样同时过滤“小于”。我的问题是,由于两个过滤器均以排名值作为目标,因此我无法同时从大于和小于中筛选出排名。任何帮助将不胜感激!