Questions tagged «angular-reactive-forms»

在TS is_edit = true禁用... <input [disabled]="is_edit=='false' ? true : null" id="name" type="text" [(ngModel)]="model.name" formControlName="name" class="form-control" minlength="2"> 我只是想基于true或禁用输入false。 我尝试了以下操作： [disabled]="is_edit=='false' ? true : null" [disabled]="is_edit=='true'" [disabled]="is_edit"

123 angular  angular-reactive-forms  disabled-input 

FormGroup： 一个FormGroup将每个子FormControl的值聚合到一个对象中，并以每个控件名称作为键。 const form = new FormGroup({ first: new FormControl('Nancy', Validators.minLength(2)), last: new FormControl('Drew') }); FormArray： 甲FormArray聚集每个子FormControl的值到一个数组。 const arr = new FormArray([ new FormControl('Nancy', Validators.minLength(2)), new FormControl('Drew') ]); 什么时候应该使用另一个？

91 angular  angular2-forms  angular-reactive-forms 

我在Angular中有一个反应形式，如下所示： this.AddCustomerForm = this.formBuilder.group({ Firstname: ['', Validators.required], Lastname: ['', Validators.required], Email: ['', Validators.required, Validators.pattern(this.EMAIL_REGEX)], Picture: [''], Username: ['', Validators.required], Password: ['', Validators.required], Address: ['', Validators.required], Postcode: ['', Validators.required], City: ['', Validators.required], Country: ['', Validators.required] }); createCustomer(currentCustomer: Customer) { if (!this.AddCustomerForm.valid) { //some app logic } } this.AddCustomerForm.valid返回false，但是一切看起来不错。 我试图通过检查控件集合中的status属性来查找。但是我想知道是否有一种方法可以找到无效的并显示给用户？

89 angular  angular-reactive-forms  reactive 

我们有一个具有动态构建表单的组件。用验证器添加控件的代码可能如下所示： var c = new FormControl('', Validators.required); 但是，假设我要稍后添加2nd Validator 。我们怎样才能做到这一点？我们在线上找不到任何文档。我确实发现，尽管在表单控件中有setValidators this.form.controls["firstName"].setValidators 但目前尚不清楚如何添加新的或自定义验证器。

84 angular  forms  angular-reactive-forms 

我无法找出如何将所有表单字段都标记为已触摸。主要问题是，如果我不触摸字段并尝试提交表单-验证错误未显示。我的控制器中有这段代码的占位符。 我的想法很简单： 用户点击提交按钮 所有字段都标记为已触摸 错误格式化程序重新运行并显示验证错误 如果有人有其他想法如何在提交时显示错误而不执行新方法，请与他人分享。谢谢！ 我的简化形式： <form class="form-horizontal" [formGroup]="form" (ngSubmit)="onSubmit(form.value)"> <input type="text" id="title" class="form-control" formControlName="title"> <span class="help-block" *ngIf="formErrors.title">{{ formErrors.title }}</span> <button>Submit</button> </form> 而我的控制器： import {Component, OnInit} from '@angular/core'; import {FormGroup, FormBuilder, Validators} from '@angular/forms'; @Component({ selector : 'pastebin-root', templateUrl: './app.component.html', styleUrls : ['./app.component.css'] }) export class AppComponent implements OnInit …

82 angular  angular-reactive-forms  angular2-forms  angular2-formbuilder 

我的页面上有一个表单，当我调用FormGroup.reset()它时，将forms类设置为，ng-pristine ng-untouched但FormControl.hasError(...)仍然返回true。我在这里做错了什么？ 模板 <form [formGroup]="myForm" (ngSubmit)="submitForm(myForm)"> <mat-form-field> <input matInput formControlName="email" /> <mat-error *ngIf="email.hasError('required')"> Email is a required feild </mat-error> </mat-form-field> <mat-form-field> <input matInput type="password" formControlName="password" /> <mat-error *ngIf="password.hasError('required')"> Password is a required feild </mat-error> </mat-form-field> <button type="submit">Login</button> </form> 零件 export class MyComponent { private myForm: FormGroup; private email: FormControl = …

79 html  angular  typescript  angular-material  angular-reactive-forms 

尝试将新的formControl条目动态添加到Angular中的formGroup中。 method() { this.testForm.addControl('new', ('', Validators.required)); } 能做到吗？

77 angular  angular-reactive-forms  form-control