具有初始禁用控制权的反应表单有效性

Question

我目前有一个Reactive Form，它以下列方式构建：

this.formGroup = this.formBuilder.group({
    email: this.formBuilder.control({value: null, disabled: true}, [emailValidator, Validators.required]),
    username: this.formBuilder.control('', [Validators.required])
});

我有一个CSS类，我要添加到我的DOM上的一个元素，这取决于表单是否有效（两个字段都有值）：

[class.disabled]="!formGroup.valid"

唯一的问题是，当username控件为空时，会应用CSS类，但只要我输入一个值，即使第二个控件email，CSS类也会被删除仍然没有值（显示的值是占位符）。

我想知道这是否是由表单状态对象中的value: null引起的。即使值为null，控件仍然具有值，这意味着当输入username时，表单将进入valid状态。

关于如何解决这个问题的任何想法？

由于

Answer 1

相反，检查表单是有效的，您只需检查控件是否有效

试试这个

[class.disabled]="!formGroup.controls['email'].valid"

Answer 2

将此更改为

func displayMessagingUI() {

    let composeVC = MFMessageComposeViewController()
    composeVC.messageComposeDelegate = self
    composeVC.recipients = [String(8005551212)]
    composeVC.body = "This is a test message."

    if MFMessageComposeViewController.canSendSubject() {
        composeVC.subject = "Subject"
    }

    self.present(composeVC, animated: true, completion: nil)
}