Question

在我的一个页面上，我使用FormBuilder在初始化时填写表单。只要输入不为空，每个输入都会获得一个类。这是通过向每个输入添加ngClass并订阅FormGroup的{{1}}来完成的。

只要以编程方式填充表单，就会出现问题。每当用户更改表单上的任何值时，都会调用valueChanges，但使用valueChanges时则不是这种情况。

我的问题是：如果FormBuilder完成，如何触发valueChanges事件。

我尝试过使用FormBuilder，但这并没有带来任何结果。

Answer 1

我找到了一个适合我的解决方案。我忘记了updateValueAndValidity函数中的两个参数。

onlySelf：只有在真实时才会更新此FormControl。
emiteEvent：会在{true}时触发valueChanges事件。

结果你会得到类似的东西： FormGroup.updateValueAndValidity({ onlySelf: false, emitEvent: true });

Answer 2

你的问题不是100％明确，但我认为你在说什么：

我的valueChanges在UI中更改内容时工作正常，但我想在构造函数中初始化FormBuilder对象以处理初始条件后立即触发我的订阅函数逻辑。

在这种情况下，我所做的很简单：

    this.searchForm.valueChanges
        .pipe(startWith(initialValues)).subscribe(value =>
        {
            // whatever you want to do here
        });

initialValues是您初始化表单的原始数据。你也许可以放入searchForm.getRawValue()。

这只会导致观察者立即开火。

Answer 3

我使用patchValue重置表格中的值并以编程方式触发更改：

this.MyForm.controls["MyField"].patchValue(MyField);

订阅更改：

this.MyForm.get("MyField").valueChanges.subscribe(val => {
    if (val) {
        const MyField = this.MyForm.get("MyField");
    }
});

Answer 4

您的问题的标题和说明有点误导。这是什么？（ⅰ）

您是否希望在以编程方式更改其值时更新字段的有效性状态？
或者您是否希望在以编程方式更改其值时确保调用字段的valueChanges？

无论如何，看看这个Plunkr：https://plnkr.co/edit/4V4PUFI1D15ZDWBfm2hb?p=preview

当您以编程方式设置字段值时，您会看到：

this.myForm.get('myField').setValue(newValue);

字段的有效性和valueChanges可观察性都会更新。因此，您似乎正在尝试重新创建已经存在的行为。

但是，在以编程方式更改其值时，不会更新该字段的dirty属性（如per the doc：“如果用户在UI中更改了值，则控件很脏/ em>的“）。可能是您正在检查dirty属性以指示字段错误，并且您有幻觉有效状态未更新，实际上它只是dirty没有更新的财产？

（i）这两件事是不同的。您不应订阅valueChanges来手动触发验证。应通过在表单模型中声明验证器来强制执行验证。

如何以编程方式触发`valueChanges`？

4 个答案: