Question

这对我来说可能是可悲的，但是我似乎无法使用Material css来记录使用Angular 5+选择的Select值。简而言之，它所要做的只是返回所选选项的值，然后将其打印在控制台中。

html

<mat-select (change)='filter(element)'>
      <mat-option value='2018'>2018</mat-option>
      <mat-option value='2017'>2017</mat-option>
      <mat-option value='2016'>2016</mat-option>
      <mat-option value='2015'>2015</mat-option>
    </mat-select>

打字稿

filter(e:Element)
  {
    console.log(e)
  }

任何帮助将不胜感激。

Answer 1

最好的方法是像使用ngModel

<select [(ngModel)]="selectedValue" (selectionChange)="printVal()">
<mat-option value=''>Select Value</mat-option>
  <mat-option value='2018'>2018</mat-option>
  <mat-option value='2017'>2017</mat-option>
  <mat-option value='2016'>2016</mat-option>
  <mat-option value='2015'>2015</mat-option>
</select>

在您的ts

selectedValue = '';
printVal(){
   console.log(this.selectedValue)
   }

此处ngModel是双向绑定，每当您选择一个选项时都会触发selectionChange

如果要使用事件打印值，只需更改功能

使用Angular 6+捕获选择选项值

1 个答案: