Angular 如何编写验证以检查两个字段中的一个字段是否为空？

因此，在myForm中，有两个字段name和email，我想添加验证以检查用户是否输入其中任何一个，它将通过验证； 如果两个字段都为null或空，则会失败

如何组合这样的验证器以满足我的场景

<form [formGroup]="myForm" novalidate (ngSubmit)="submit(myForm.value)">
<div class="row">
    <div class="col-md-2"></div>
    <div class="col-md-8">
        <div class="card">
            <div class="card-header my-contact-info">
                My Contact Info
            </div>
            <div class="card-block">
                <div class="row">
                    <div class="col-md-6">
                        <div class="form-group">
                            <label>Name:</label>
                            <small class="alert" *ngIf="!myForm.controls['name'].valid && myForm.controls['name'].touched">This field is required.</small>
                            <input type="text" class="form-control" formControlName="name">
                        </div>
                        <div class="form-group">
                            <label>Email:</label>
                            <small class="alert" *ngIf="!myForm.controls['email'].valid && myForm.controls['email'].touched">This field is required. Please input a valid email.</small>
                            <input type="text" class="form-control" formControlName="email">
                        </div>
                    </div>
                    <div class="col-md-6">

                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

---

我将为此创建一个自定义验证器，类似于：

import {FormControl, FormGroup, ValidatorFn} from '@angular/forms';
import {Observable} from 'rxjs/Observable';

export const OneFilledOutValidator = (): ValidatorFn => {

  return (group: FormGroup): {[key: string]: boolean} => {

    const fields = [];

    for (const field in group.controls) {

      if (group.controls.hasOwnProperty(field)) {
        fields.push(group.get(field).value);
      }
    };

    const result = fields.filter(field => !!field);

    const valid = result.length !== 0;

    return valid ? null : {
      oneFilledOut: true
    };
  };
};

这基本上采用一个表单组，并检查是否有任何控件具有值

this.myForm = this._fb.group({
    'name': [null, [Validators.minLength(3)]],
    'email': [null, [Validators.email]]
}, OneFilledOutValidator); // I would wrap this in a CustomValidators constant

---

您可以使用或条件在提交功能中检查此项。如果给出了其中任何一个，则执行您的代码，否则将抛出一个验证错误。@AluanHaddad我只是抓取了一个简单的示例。没有必要对这种愚蠢的事情投否决票。@AluanHaddad Happy？@AluanHaddad以后，你可以自己编辑答案，并添加第一条评论作为编辑描述。而不是对整个答案投否决票，因为这确实会误导问题的作者。如果代码本身按预期工作，有时使用any也没什么错。@Chrillewoodz当你做一个很好的一般情况时，我看到Angular社区中出现了很多糟糕的TypeScript，值得投下一票<代码>任何在推理上下文中几乎总是错误的。这也没有道理。为什么人们会编写更多的代码，这样他们就可以使用更糟糕的工具，从而破坏使用TypeScript的目的？一般来说，我只从Angular用户那里看到这种垃圾，我认为这是因为框架鼓励人们误解类型是什么（例如参见

接口类型
声明）@AluanHaddad我意识到，有一些因素可以解释为什么Angular人在类型脚本方面如此差劲。但这与这个问题完全无关，所以我不想讨论这个问题。但就像我说的，你可以随时编辑答案，并告诉答案的作者他或她做错了什么。我总是想知道我做错了什么，但不是以对完美答案投反对票的形式。而是用更好的例子和解释
this.myForm = this._fb.group({
    'name': [null, [Validators.minLength(3)]],
    'email': [null, [Validators.email]]
}, OneFilledOutValidator); // I would wrap this in a CustomValidators constant