[英]How can I write an Angular ngFor pipe to filter array of objects by object property?
I have 2 selects. 我有2个选择。
One for Leagues
and one for Divisions
一个用于
Leagues
,一个用于Divisions
I want to create a Pipe
that will filter Divisions
depending on what League
is selected. 我想根据选择的
League
创建一个过滤Divisions
的Pipe
。
Giving the data below. 提供以下数据。 If I select
Random Beer League
only TwoFour
and SixPack
should show up as options for the Divisions
select. 如果我选择
Random Beer League
只有TwoFour
和SixPack
应显示为Divisions
选项的选项。
leagues = [
{id: 1, leagueName: 'Recreation League' },
{id: 2, leagueName: 'Random Beer League' }
];
divisions = [
{id: 1, divisionName: 'SoGreen', leagueId: 1, leagueName: 'Recreation League' },
{id: 2, divisionName: 'Yellow', leagueId: 1, leagueName: 'Recreation League' },
{id: 3, divisionName: 'TwoFour', leagueId: 2, leagueName: 'Random Beer League' },
{id: 4, divisionName: 'SixPack', leagueId: 2, leagueName: 'Random Beer League' }
];
PLUNKER to show the setup PLUNKER显示设置
*Note - data in plunker is hard coded but in my app setup its Observable. *注意 - plunker中的数据是硬编码的,但在我的应用程序中设置了Observable。
I have create a custom pipe and used it to filter division dropdown. 我创建了一个自定义管道并用它来过滤部门下拉列表。
@Pipe({
name: 'myfilter',
pure: false
})
export class MyFilterPipe implements PipeTransform {
transform(items: any[], args: any[]): any {
return items.filter(item => item.leagueName.indexOf(args.leagueName) > -1);
}
}
<option *ngFor="let division of divisions | myfilter:leagueSelected" [ngValue]="division">{{division.divisionName}}</option>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.