相关疑难解决方法(0)

多个字段上的 Angular 4 表单验证

编辑: 我想要实现的是对单个 formControl 而不是整个表单的验证。验证器应检查所有原子字段,如门牌号、街道等,然后使谷歌地图输入控件无效。


我正在使用 Google 地图自动完成对表单进行编程。用户应在触发 Google 地图自动完成逻辑的输入字段中输入地址。选择地址后,回调函数会选择街道、门牌号等,并使用 API 结果填写所需的地址数据字段。其他表单元素显示但只读,因此我们始终可以获得有效数据并可以对输入进行验证。

问题是我的验证器没有触发输入字段。主输入字段始终有效并且不会获得 ng-invalid 类。

@Component({
  selector: 'my-app',

  styles: [`
    .ng-valid {
      border:#0ff;
    }

    .ng-invalid {
      border:#f00;
    }
  `],
  template: `

  <form [formGroup]="testForm">
                <input type="text" formControlName="address">
                <input type="text" formControlName="tel">
                <input type="text" formControlName="mail">
            </form>
  `
})
export class AppComponent {
  testForm:FormGroup;


  constructor(private fb: FormBuilder) {
    this.testForm = this.fb.group({
            address:['', myValidator],
            tel:[''],
            mail:['']
        }, {
            validator: myValidator("tel", "mail")
        });
  }
}

export const myValidator = (field1, field2): ValidatorFn => (control: AbstractControl) => { …
Run Code Online (Sandbox Code Playgroud)

validation typescript angular angular-reactive-forms

8
推荐指数
2
解决办法
1万
查看次数

Angular 2中的条件验证

Angular 2中的验证非常简单,非常棒.但是,如果选择了其他字段,如何使必填字段可选.

这是我的规则

this.contractsFilter = this.fb.group({
  selectedContractType: ['', [Validators.required]],
  selectedYear: ['', [Validators.required]],
  selectedPde: ['', [Validators.required]],
  refNo: ['', []]
});
Run Code Online (Sandbox Code Playgroud)

如果refNo由用户提供,我希望其他标记为必需的字段为"不需要".

javascript validation angular

5
推荐指数
1
解决办法
1295
查看次数