我需要获取mat-select数据,特别是文本及其值。这是我到目前为止实现mat-select的方式..
<mat-select placeholder="Transaction Type" (selectionChange)="selected($event)" formControlName="TransactionTypeID">
<mat-option *ngFor="let t of transactionTypes" [value]="t.TransactionTypeID">
{{t.TransactionType}}
</mat-option>
</mat-select>
这就是我在.ts文件中获取值的方法:this.formDetail.get('TransactionTypeID').value,
这是我尝试获取文本或't.TransactionType':
selected(event: MatSelectChange) {
console.log(event);
}
你能告诉我怎么做吗?谢谢。
使用正常更改事件,您可以获得如下所示的值
在.html文件中
<mat-select placeholder="Transaction Type" (change)="selected($event)" formControlName="TransactionTypeID">
<mat-option *ngFor="let t of transactionTypes" [value]="t.TransactionTypeID">
{{t.TransactionType}}
</mat-option>
</mat-select>
在.ts文件中
selected(event) {
let target = event.source.selected._element.nativeElement;
let selectedData = {
value: event.value,
text: target.innerText.trim()
};
console.log(selectedData);
}
要完成前面的答案,可以使用MatOption的viewValue。 Angular 7编译器也想知道event.source.selected应该是数组还是单个对象。
selected(event: MatSelectChange) {
const selectedData = {
text: (event.source.selected as MatOption).viewValue,
value: event.source.value
}
console.log(selectedData);
}