因此，當我打開一個專案編輯器對話框時，我希望能夠放入一些默認值，從我選擇的特定專案中獲取。在我在每個欄位中添加[[ngModel]]之前，這一切都在作業。事實上，當我洗掉它時，它仍然作業。我希望能夠在不移除 ngModel 的情況下再次進行操作，因為我在代碼中非常依賴它。
這是我的 HTML
<< div mat-dialog-content class="formCentered"/span>>
<form [formGroup]="form"/span>>
<mat-form-field class="inputBox"/span>>
<mat-label>Scanner</mat-label>/span>
< input matInput formControlName="scannerName" [(ngModel)]="data. scanName" maxlength="50">。
</mat-form-field>/span>
<mat-form-field class="inputBox"/span>>
<mat-label>Calibration Price</mat-label>/span>
< input matInput formControlName="caliprice" [(ngModel)]="data. caliPrice" maxlength="50">。
</mat-form-field>/span>
<mat-form-field class="inputBox"/span>>
<mat-label>Calibration Description</mat-label>
< input matInput formControlName="calibrationDescription" [(ngModel)]="data. caliDescription" maxlength="50">。
</mat-form-field>/span>
</form>/span>
</div>/span>
<div mat-dialog-actions class="alignRight">/span>
< button mat-button class="confirmButton" （click）="onNoClick()" class="confirmativeButton"> 取消</按鈕>
< button mat-button class="confirmationButton" [mat- dialog-close]="data" cdkFocusInitial class="confirmativeButton"> 保存</按鈕>
</div>/span>
而這是我的這部分ts
dialogRef.componentInstance.form.patchValue（{
scannerName: cal.scannersName, // scannerName是舊值（未經編輯）。
校準價格：Cal.cal.calibrationPrice，//校準價格是舊值（未經編輯）。
calibrationDescription: cal.calibrationDescription // calibrationDescription是舊值（未經編輯）。
});
有什么想法可以讓我實作嗎？
uj5u.com熱心網友回復：
你不能在formGroup中添加NgModel。
你必須定義formControl
。舉例：
form = new FormGroup({
scannerName: new FormControl(''/span>)。
calibrationPrice: new FormControl('') 。
calibrationDescription: new FormControl('') 。
})
如果你想設定默認值，你必須像這樣在new FormControl中設定值：
form = new FormGroup({
scannerName: new FormControl（'test'）。
calibrationPrice: new FormControl（'value'）。
calibrationDescription: new FormControl（someValue）。
})
看來你想改變data變數，你可以這樣做：
this。 data = this.form.value。
uj5u.com熱心網友回復：
用ngModel合并反應式表單不是一個好的做法。
你可以洗掉html中所有的[(ngModel)]，并訂閱表單的變化。然后，當表單的某些欄位發生變化時，訂閱也將改變你的原件。
在你的ts代碼中加入這樣的內容：
//在你將表單正式化后。
this.form.get('scannerName').valueChanges
.訂閱((val: any) => {
//this.data.scanName = this.form.get('scannerName').value;
this.data.scanName = val。
});
this.form.get('calibrationPrice').valueChanges
.訂閱((val: any) => {
//this.data.calibrationPrice= this.form.get（'calibrationPrice'）.value;
this.data.calibrationPrice= val。
});
this.form.get('calibrationDescription').valueChanges
.訂閱((val: any) => {
//this.data.calibrationDescription= this.form.get('calibrationDescription').value;
this.data.calibrationDescription= val。
});
轉載請註明出處，本文鏈接：https://www.uj5u.com/qukuanlian/307505.html
標籤：
上一篇：當試圖獲取欄位的值時出現AttributeError
下一篇：移動多列