5

2選あります。

1Leaguesつと 1 つDivisions

選択内容に応じてPipeフィルタリングする を作成したいと考えています。DivisionsLeague

以下にデータを与えます。選択した場合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 セットアップを表示する

*注 - plunker のデータはハードコードされていますが、私のアプリのセットアップでは Observable です。

4

1 に答える 1

9

カスタム パイプを作成し、それを使用して分割ドロップダウンをフィルター処理しました。

@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>

このPlkrを調べてください

于 2017-01-12T05:27:38.090 に答える