我的父組件使用 FormGroup 并且我希望子組件向其父組件報告值更改。我嘗試通過在子組件中使用 NG_VALUE_ACCESSOR 來解決這個問題,以允許它充當表單欄位。據我所知,應該使用以下 4 個函式
writeValue(value) {
this.value = value;
}
registerOnChange(fn: any) {
this.onChange = fn;
}
registerOnTouched(fn: any) {
this.onTouch = fn;
}
setDisabledState?(isDisabled: boolean): void {
this.isDisabled = isDisabled;
}
為了表現得像一個表單域。這是我目前的非作業解決方案:
https://stackblitz.com/edit/angular-ivy-tpneik?file=src/app/app.component.ts
當前錯誤說:
錯誤:沒有路徑的表單控制元件的值訪問器:'ok -> isChecked'
目標是擁有一個子組件(可能還有更多),可以將其值更改正確地報告給父組件中的父表單。我該如何解決這個問題?
uj5u.com熱心網友回復:
你在你的孩子體內有一個單獨的表格,你也在那里重建你的孩子表格。只需將構建的嵌套表單組傳遞給孩子,您就可以開始了。父母會知道孩子發生了什么。
將表單組作為變數向下傳遞:
<div formGroupName="child">
<app-form [formGroupChild]="formGroupChild" [myArray]="myArray"></app-form>
</div>
在孩子中,獲取陣列和表單組,將 [formGroup] 附加到 div 并發揮您的魔力!
<div [formGroup]="formGroupChild">
<div class="container">
<div *ngFor="let category of myArray" [formGroupName]="category.id">
<input type="checkbox" formControlName="isChecked">
<div [style.color]="category.textColor">
{{ category.name }}
</div>
</div>
</div>
</div>
這里不需要 controlvalueaccessor :)
你分叉的STACKBLITZ
轉載請註明出處,本文鏈接:https://www.uj5u.com/net/349588.html
上一篇:在Ruby中將哈希作為引數傳遞
