首页 文章

patchValue无法在FormArray上运行

提问于
浏览 次
0

每当控件的值发生任何变化时，我都会在ngrx存储中存储FormArray值 .

Form Array有47个表单组，每个表单组都有一个表单控件 .

我有一个父FormGroup，它有10个Form Arrays，用于10个不同的数据集 . 这10个表单数组可以有不同数量的FormGroup和一个表单控件 .

我注意到的是当我更改控件的值时 . 我可以在valueChange事件处理程序中看到它发生变化，这是我在ngrx中推送更新值的地方 .

如果我去另一个数据集;我可以在控制台中看到主表单具有我更改的控件的更新值 .

但是，如果我回到相同的数据集; valueChanges会自动触发，并且它正在尝试为我更改的控件设置旧值 .

我有一个保护子句只能在valueChanges中继续，如果控制是脏的，在正常情况下工作，但是，它正在为我创造一个情况，因为这次控制是脏的，旧的值也写入并推送到ngrx .

我需要弄清楚为什么valueChanges会被触发，为什么在重新访问我做出更改的数据集之前，我可以看到父表单确实具有正确的值时，它会被旧值触发 .

在重新渲染时，如果我正在检查ngrx存储中是否存在Form Array值 . 如果是，那么我将使用FormArray值得到的FormArray patchValue，我之前存储了值更改 .

我可以看到来自ngrx store的表单数组值具有更新值，但是当我调用时

this.formArray.patchValue（formArrayValue）;

我看到valueChanges被调用但是使用旧值并且在patchValue之后 - this.formArray仍然具有旧值 .

我在这里做错了什么或遗漏了什么 .

Code Snippets

这就是我在表单组中创建控件并将它们添加到表单数组的方式 .

const fg: any = {};     
const rules = this.validationRules.filter(vc => vc.AttributeName.toLowerCase() === prop.key.toLowerCase());

     fg[key] = this.createControl(rules);
         if (value) {
                fg[key].setValue(value,
                 {
                    onlySelf: true,
                    emitEvent: false,
                    emitModelToViewChange: false,
                    emitViewToModelChange: false
                   });
            }

           const formGroup = new FormGroup(fg);
           this.controlsArray.push(formGroup);

这就是我试图在ngOnChanges中修补Value my Form Array的方法

this.store.pipe(select(fromForms.getFormsState))
.pipe(take(1))
.subscribe(f => {
    const formArray = f.forms.forms[tableName];
    if (formArray) {
        this.controlsArray.patchValue(formArray);
    }
});

如果有帮助的话，我会尝试添加一些代码片段 .

谢谢

angular forms ngrx

1 回答

  • 0
    <mat-form-field>
   <input type="text" matInput placeholder="{{ label }}" [formControlName]="key" [readonly]="!isEditable" [(ngMode)]="value">
</mat-form-field>

    我在输入控件上有 [(ngMode)]="value" ，我正在构建一个Reactive表单 . 虽然我的FormGroup确实发生了变化，但是当表单被渲染时，它一直在查看未更新的模型，因此它也强制FormGroup具有旧值 .

    所以请确保检查不必要的 [(ngMode)]="value" .

    回复于

相关问题