如何使用角度材质列表

Question

我想在选择列表中显示项目列表。该列表表示对象的所有可能的值。我想预先检查这个对象中包含的现有值。

如果我的对象是“foo”。 然后，我希望foo.items中的所有值都在项目列表中预先检查。

template.html

<mat-selection-list #itemList> 
    <h3 mat-subheader>Items</h3> 
    <mat-list-option *ngFor="let item of items"> {{items.name}} </mat-list-option> 
    </mat-selection-list> 

component.ts

ngOnInit() { 
this.route.url.subscribe(url => { 

    this.itemService.findAll().subscribe(items => { 
    this.items = items; 
    }); 

    const options: string[] = []; 
    options['include'] = 'items'; 
    this.route.params 
    .switchMap((params: Params) => this.fooService.findById(params['id'], options)) 
    .subscribe((item) => { 
     this.foo = foo; 
    }); 
}); 

我需要做什么处理呢？文档是非常succint

Answer 1

我得到了它的工作就像这样：

<mat-selection-list #filterList name="filterList" [(ngModel)]="filter" ngDefaultControl> 
    <mat-list-option *ngFor="let option of filterOptions" value="{{ option.value }}"> 
    {{ option.title }} 
    </mat-list-option> 
</mat-selection-list> 

ngOnInit() { 
    this.filterList.selectedOptions.onChange.subscribe(item => { 
     item.added.map(added => this.filters.push(added.value)); 
     item.removed.map(removed => this.filters = this.filters.filter((val: any) => { 
     return val !== removed.value; 
     })); 
    }); 
    }