1

我正在使用带有多选选项的 MatSelect。在每个元素检查或取消选中都有一个打字稿函数，每次都会被调用，所以问题是，我无法区分哪个点击事件是从 UI 填充的。Apple 检查然后调用 API，如果 Apple 未检查，则什么也不做

.html 文件

 <mat-form-field>
    <mat-select [(value)]="selected" formControlName="tagList" id="tagList" placeholder="Select Tag" name="tagList" multiple>
      <mat-option *ngFor="let tag of tagList" [value]="tag" 
         (click)="isSelectedTagIsCallback(tag, $event.value)">
         {{tag.name}}
      </mat-option>
    </mat-select>
 </mat-form-field>

.ts 文件

isSelectedTagIsCallback(data, event) {
      if(checked){
         // Call API
      }
     else{
       // Do nothing
     }
}

上述方法是对还是错？如果正确，那么我如何获得该已检查/未检查事件或标志以根据值调用 API

4

1 回答 1

0

试试这个，你不需要将选项值传递给函数：在你的打字稿中是这样的：

selected: any = '';
isSelectedTagIsCallback() {
    if(this.selected!=''){
       alert(this.selected); //CALL API Here
    }else{
       // Do nothing
}

在您发布替换isSelectedTagIsCallback(tag, $event.value)到isSelectedTagIsCallback()In 函数的 html 中，您可以获得多个用逗号分隔的复选框值。

这是工作示例：angular-multiple-value-selected-in-material

希望对你有帮助！

于 2018-05-22T09:36:45.783 回答