Angular 角度2材质垫选择多次调用

Angular 角度2材质垫选择多次调用,angular,angular-material2,Angular,Angular Material2,我用的是有棱角的材料。当我使用onSelectionChange时,它会在页面加载或更改选择时多次调用。谁能帮帮我吗 <mat-form-field> <mat-select id="stateSelect" name="stateSelect" class="form-control" placeholder="State Select" [(ngModel)]="myModel.state" required> <

我用的是有棱角的材料。当我使用onSelectionChange时,它会在页面加载或更改选择时多次调用。谁能帮帮我吗

 <mat-form-field>
   <mat-select id="stateSelect" name="stateSelect" class="form-control" 
               placeholder="State Select" [(ngModel)]="myModel.state" required>
     <mat-option (onSelectionChange)="updateState($event)" *ngFor="let state of stateList" [value]="state.code">
       {{ state.value }}
     </mat-option>
   </mat-select>
   <mat-error>State is required</mat-error>
 </mat-form-field>

 // In my ts file
 updateState(event: any) {
   // my code
 }

{{state.value}}
国家是必需的
//在我的ts文件中
更新不动产(事件:任何){
//我的代码
}

我已经使用event.isUserInput来检查true是否为false,但有时它在没有任何选择的情况下进入条件。有人请在这方面帮助我

我还没有测试以下代码,但我认为您可以这样使用select和option标记:

<mat-form-field>
  <mat-select id="stateSelect" name="stateSelect" class="form-control" 
      placeholder="State Select" [(ngModel)]="myModel.state" (selectionChange)="updateState($event)" required>
    <mat-option *ngFor="let state of stateList" [value]="state.code">
      {{ state.value }}
    </mat-option>
  </mat-select>
  <mat-error>State is required</mat-error>
</mat-form-field>

{{state.value}}
国家是必需的

使用mat select中的选择更改事件,而不是mat选项中的选择更改事件。有关更多信息,请参阅资料。

我尚未测试以下代码,但我认为您可以这样使用select和option标记:

<mat-form-field>
  <mat-select id="stateSelect" name="stateSelect" class="form-control" 
      placeholder="State Select" [(ngModel)]="myModel.state" (selectionChange)="updateState($event)" required>
    <mat-option *ngFor="let state of stateList" [value]="state.code">
      {{ state.value }}
    </mat-option>
  </mat-select>
  <mat-error>State is required</mat-error>
</mat-form-field>

{{state.value}}
国家是必需的

使用mat select中的选择更改事件,而不是mat选项中的选择更改事件。有关更多信息,请参阅资料。

我推荐@4ndt3s的答案。(为了防止相同的选择,)

onLangChange($Event)
的事件值具有指示面板是否打开的值。
没错。
因此,如果您需要允许选择相同的选项,
请参阅此


我推荐@4ndt3s的答案。(为了防止相同的选择,)

onLangChange($Event)
的事件值具有指示面板是否打开的值。
没错。
因此,如果您需要允许选择相同的选项,
请参阅此


是的,我也尝试了这个方法,但没有调用updateState()方法。我尝试了代码,结果成功了,记住事件是selectionChange。我用Angular 5.2进行了测试。我的代码中的selectionChange放错了位置。我使用了mat选项而不是mat select。现在它开始工作了。谢天谢地。谢谢是的,我也尝试过这个方法,但没有调用updateState()方法。我尝试了代码,结果成功了,记住事件是selectionChange。我用Angular 5.2进行了测试。我的代码中的selectionChange放错了位置。我使用了mat选项而不是mat select。现在它开始工作了。谢天谢地。谢谢