[英]Angular 6, How to get the target element for an 'onSelectionChange' dom event?
Using angular 6, whenever the selection changes I want to get the "formControlName" of the corresponding element. 使用角度6,每当选择更改时,我都希望获取相应元素的“ formControlName”。
HTML HTML
<mat-form-field *ngIf="dispatchAdviceChildForAdd._isEditMode" class="mat-form-field-fluid">
<mat-select placeholder="Select Product" formControlName="newProductCode" required>
<mat-option *ngFor="let pl of productList" value="{{pl.productCode}}" (onSelectionChange)="changeValues($event,pl)">{{pl.productCode}}</mat-option>
</mat-select>
<mat-hint align="start">
<strong>Select</strong>
</mat-hint>
</mat-form-field>
TYPESCRIPT "changeValues" TYPESCRIPT“更改值”
changeValues(event, data: ProductListModel) {
// here i need formControlName
}
I have tried the following ways but no help: 我尝试了以下方法,但没有帮助:
changed(event) {
console.log(event.target.id);
}
I have also tried 我也尝试过
changed(event) {
const target = event.target || event.srcElement || event.currentTarget;
const idAttr = target.attributes.id;
const value = idAttr.nodeValue;
}
Am i missing something, but why don't you just provide it like this: 我是否想念一些东西,但是为什么不这样提供:
changeValues(event, data: ProductListModel, controlName: string) { // here i need formControlName }
<mat-form-field *ngIf="dispatchAdviceChildForAdd._isEditMode" class="mat-form-field-fluid"> <mat-select placeholder="Select Product" formControlName="newProductCode" required> <mat-option *ngFor="let pl of productList" value="{{pl.productCode}}" (onSelectionChange)="changeValues($event,pl,'newProductCode')">{{pl.productCode}}</mat-option> </mat-select> <mat-hint align="start"> <strong>Select</strong> </mat-hint> </mat-form-field>
To get reference to the component itself, you can use: 要获得对组件本身的引用,可以使用:
changeValues(event, something, matComponent) { // not using material components so i dont know the class }
<mat-form-field *ngIf="dispatchAdviceChildForAdd._isEditMode" class="mat-form-field-fluid"> <mat-select #matSelect placeholder="Select Product" formControlName="newProductCode" required> <mat-option *ngFor="let pl of productList" value="{{pl.productCode}}" (onSelectionChange)="changeValues($event,pl, matSelect)">{{pl.productCode}}</mat-option> </mat-select> <mat-hint align="start"> <strong>Select</strong> </mat-hint> </mat-form-field>
Here is used template referencing with #matSelect and then providing it to callback 这是使用#matSelect引用的模板,然后将其提供给回调
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.