Javascript Angular 6只需要多个字段中的一个字段

我是新来的。我有一个场景，其中我只需要表单中5个字段中的一个字段，这意味着如果用户至少填写了一个字段，那么表单将变为有效

---

提前感谢。

请查看此电话号码验证程序示例

import { FormGroup, FormBuilder, Validators } from '@angular/forms';
import { NumberValidator } from '../validators/form-validators';


constructor(
    private fb: FormBuilder){}

FormName: FormGroup = this.fb.group({
    phoneNumber: ['', NumberValidator]    
  });

表单验证程序文件

import { AbstractControl, ValidatorFn } from '@angular/forms';

export const NumberValidator = (): ValidatorFn => {
  return (control: AbstractControl): { [key: string]: any } | null => {
    const mobileRegex = /^[()-\d\s]*$/g;
    const result = mobileRegex.test(control.value);
    return result ? null : { mobileInvalid: { value: control.value } };
  };
};

如果您有任何疑问，请告诉我。

    <form [formGroup]="formdata">
<div class="form-group">
    <label for="fieldlabel1">fieldLabel1</label>
    <input type="text" id="fieldlabel1" formControlName="fieldName1" class="form-control"><br>
    <label for="fieldlabel2">fieldLabel2</label>
    <input type="text" id="fieldlabel2" formControlName="fieldName2" class="form-control">
</div>
 </form>

<div class="row">
      <div class="col-sm-12">
        <button type="submit" value="submit" (click)="somefunctioncall()" [disabled]="formdata.invalid">
          Submit
        </button>
      </div>
</div>



import { FormGroup, FormControl, Validators } from '@angular/forms';
import { OnInit } from '@angular/core';

export class test {

formdata: FormGroup;

 ngOnInit() {


  this.formdata = new FormGroup({

      fieldName1: new FormControl("", Validators.compose([
        Validators.required
      ])),
      fieldName2: new FormControl("", Validators.compose([
        // remove required validation for one you dont need.
      ]))
    })   
 }
}

现场标签1


现场标签2
提交
从'@angular/forms'导入{FormGroup，FormControl，Validators}；
从“@angular/core”导入{OnInit}；
导出类测试{
formdata:FormGroup；
恩戈尼尼特（）{
this.formdata=new FormGroup({
fieldName1:newformcontrol（“），Validators.compose([
需要验证器
])),
fieldName2:新FormControl（“），Validators.compose([
//删除您不需要的验证。
]))
})   
}
}

由于只有当其中一个字段为非空时，才需要检查整个表单的有效性，因此可以手动设置有效性，如下所示：

if(!this.valid){
    this.form.setErrors({ 'invalid': true});
}else{
    this.form.setErrors(null);
}

其中

此.valid

是您可以设置有效性的条件

您可以查看以下示例：

您还可以检查答案：根据某些条件，哪个表单进行验证

---

希望这有助于查看中的自定义验证程序和跨字段验证

我们应用程序中的确切示例，其中至少必须输入一个电话号码字段。这是一个验证器函数，即实现

---

Member是我们定义所有表单字段的类，您的代码会有所不同，但自定义验证器的示例应该会有所帮助。

您能分享一些代码来帮助我们识别您正在使用的表单类型吗？您是否已经尝试过任何代码？你看过文档了吗@发动机。。我正在对FormGroup使用反应式表单。@user3492620有人回答了it@CruelEngine. 你能把链接分享给我吗？谢谢你的回答@Ravi。但我有一个不同的场景。表单中有许多字段。如果任何文件有数据，那么表格应该是有效的。像这样使用formfield:[''[ValidatorFunction（）]]创建一个函数名示例ValidatorFunction并返回有效或无效的结果。您可以通过这种方式提交表单，也可以使表单有效，如果任何字段有dataSorry，我没有得到您。你能和我分享一下代码片段吗？谢谢@crueEngine这需要根据需要设置n列中的一列。。。非条件表单验证，可防止其中一个表单被要求，但如果两个表单都为空，则会使表单无效。。。

import { AbstractControl } from "@angular/forms";
import { Member } from "../../members/member";

export function phone(control: AbstractControl): {[key: string]: any} {
  if (!control.parent) return;
  const form = control.parent;
  const member: Member = form.value;
  if (member.contactphone || member.mobile || member.contactphonesecond) {
    [
      form.controls['contactphone'],
      form.controls['mobile'],
      form.controls['contactphonesecond']
    ].forEach(control => {
      control.setErrors(null);
    });
  } else return {'noPhone': 'None of contact phones is specified'};
}