Question

尝试理解传递给setValue时'onlySelf'参数的作用。

this.form.get('name').setValue('', { onlySelf: true })

文档说：“如果onlySelf为true，则此更改只会影响此FormControl的验证，而不会影响其父组件。默认为false。”

但是我很难理解这一点。使用Angulars的模型驱动形式仍然相当新。

Answer 1

默认情况下，只要有任何表单元素值的更新，Angular2就会逐层检查表单控件/表单组的有效性，除非您拒绝。 onlySelf是帮助您实现这一目标的工具。

假设您的loginForm字段有username字段和password字段，这两个字段都是必需的，如下所示：

this.userNameControl = this.formBuilder.control('Harry', Validators.required);
this.passwordControl = this.formBuilder.control('S3cReT', Validators.required);
this.loginForm = this.formBuilder.group({
  userName: this.userNameControl,
  password: this.passwordControl
});

在此代码之后，this.loginForm.valid为true。

如果使用默认设置（onlySelf = false）设置控件的值，Angular2将更新控件的有效性以及表单组的有效性。例如，这个：

this.passwordControl.setValue('');

将导致

this.passwordControl.valid === false
this.loginForm.valid === false

但是，这个：

this.passwordControl.setValue('', { onlySelf: true });

只会更改passwordControl的有效期：

this.passwordControl.valid === false
this.loginForm.valid === true

Answer 2

这样说吧，假设您有一个名为mainForm的表单有效。它有四个控件，所有四个都有一个值。现在，您决定更新其中一个控件的值，假设您将其更新为某个不正确的值，并指定onlySelf: true。如果您尝试拨打this.mainForm.valid，即使您的控件无效，您也会得到表单有效的结果，并且无效状态不应允许要提交的表格。但由于表单有效属性报告为true，因此您将向后端提交不一致的值。

为什么你会拥有这个属性可能会让人感到困惑，但是有时你可能因为一个值或控件而不想使表单无效。可能您在服务器上有一些高级检查，并且您想要更正服务器上的值，或者您可能依赖于当时可能不可用的某些外部Web服务的值。我确信有很多场景，但这是我的头脑。

Angular 2 - FormControl setValue'only'Self'参数

2 个答案: