Angiular 5& MatAutocomplete - onSelectionChangei并不总是被解雇

时间:2018-04-08 17:10:01

标签: angular angular-material

我正在尝试使用MatAutocomplete和Angular 5,我完全按照他们在材料文档中提到的那样实现它,基于材料文档,我 可以使用(onSelectionChange)知道何时选择一个选项,问题是我无法找到一种方法来知道该选项何时被取消选中。 例如,当用户清除搜索控件时,没有事件触发更新模型,请提供任何帮助。

这是我的代码示例

<mat-form-field class="example-full-width" >
  <input matInput placeholder="Select a item" [matAutocomplete]="auto" [formControl]="autoCompleteCtrl">
  <mat-autocomplete #auto="matAutocomplete"  ngDefaultControl  [displayWith]="getDisplayFn()" >
    <mat-option *ngFor="let item of filteredItems | async" [value]="item" (onSelectionChange)="selectionChange(item)">
      {{ item.name }}   
    </mat-option>
  </mat-autocomplete>
</mat-form-field>

打字稿代码

selectedItem: any();

public getDisplayFn() {
    return (val) => this.display(val);
}
public display(item: Item): string {
    if (item) {
      return item.name;
    }
}
public selectionChange(item) {
//this is fired when an option becomes selected , 
//I need a way to clear selecedItem if the user clear the control
 this.selecedItem = item;
}

0 个答案:

没有答案