Angular 7 - 不触发“valueChanges"来自模板(使用 mat-option) [英] Angular 7 - not triggering "valueChanges" from the template (using mat-option)

问题描述

我有一个表单控件.在我的模板中，我使用 mat-option 对其进行更改，但我希望此特定更改不会触发 valueChanges(我还有其他更改希望调用valueChanges").

I have a form control. In my template I am changing it using mat-option, but I want that this specific change will not trigger valueChanges (I have other changes that I want that "valueChanges" will be called).

我的组件-

inputControl = new FormControl('');


    ngOnInit() {
        this.inputControl.valueChanges
            .pipe(takeUntil(this.onDestroy))
            .subscribe(val => {
              //do something
            });
    }

html-

<ng-container *ngIf="inputControl.value as val">
        <mat-option *ngFor="let result of autocompleteResults; let i = index" [value]="result.displayName"
                    (onSelectionChange)="searchByResult($event, result)">
           {{result.displayName}}
        </mat-option>
    </ng-container>

知道这是否可行吗?

推荐答案

你的 mat-option 必须包裹在 mat-select 中，如下所示

Your mat-option must be wrapped inside of mat-select as below

  <mat-select>
    <mat-option *ngFor="let food of foods" [value]="food.value">
      {{food.viewValue}}
    </mat-option>
  </mat-select>

查看角材料的文档.它有很好的代码片段示例

Checkout the documentation of angular material. It has pretty good examples with code snippets

链接如下:https://material.angular.io/components/select/overview

这篇关于Angular 7 - 不触发“valueChanges"来自模板(使用 mat-option)的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！