angular-reactive-forms

问题 while building crud app in angular 5 I've come across with a question, how can I use the same form builder but change what form controls I get depending on what I want, adding or updating users thru form... Here's some simple code, I will try not to complicate things, since I have pretty big form with lot of attributes... So in my app.component.html i have form <form class="form-horizontal" [formGroup]="form" #myForm="ngForm" (ngSubmit)="save()"> <div class="form-group"> <label for="firstName

问题 I'm tying to use google-place-api autoComplete in my project, but it gives me an error: TypeError: Cannot read property 'getInputElement' of undefined .html <section [formGroupName]="i" *ngFor="let tech of form.controls.stations.controls; let i = index"> <ion-item-group> <ion-item-divider color="light">Station #{{ i + 1 }}</ion-item-divider> <ion-item> <ion-label position="floating">Technology name:</ion-label> <ion-input #autoStation type="text" maxlength="50" formControlName="name"></ion

问题 I have the following classes: class License { name:string; .. lots of other fields. nameAttributes:NameAttributes[]; } class nameAttributes:NameAttributes{ index:number; attribute:string; } I know I can created the form like this, but it requires that I manually create each field(control) and every time the licences class changes, I have to update the class and this formGroup with the new fields. this.licenseForm = formBuilder.group({ name:['name value'], otherFields:['their values'],

问题 We are trying to refer to Formcontrols in a Formbuilder in a strongly typed way. Currently have a Formbuilder with 20+ fields, and need to toggle off validators and visibility, etc. Instead of having multiple boolean flags for each, we want to provide an array, that will show which forms to toggle off. We are applying formbuilder,not formarrays due to styling complicated reasons. Toggle Multiple Fields On/Off in Formbuilder, clean syntax in Angular? Found a way to strong type formcontrols in

问题 We are trying to refer to Formcontrols in a Formbuilder in a strongly typed way. Currently have a Formbuilder with 20+ fields, and need to toggle off validators and visibility, etc. Instead of having multiple boolean flags for each, we want to provide an array, that will show which forms to toggle off. We are applying formbuilder,not formarrays due to styling complicated reasons. Toggle Multiple Fields On/Off in Formbuilder, clean syntax in Angular? Found a way to strong type formcontrols in

问题 Is there a way to tie an Enum to Formbuilder names? Below, is an enum, and want to convert enum to its string, and use with Formbuilder (rather than using strings in formbuilder) Is this possible in Angular? enum address{ city, state, zip } this.addressForm = this.formBuilder.group({ 'city': [null, [Validators.required, Validators.maxLength(200)]], 'state': [null, [Validators.maxLength(200)]], 'zip':[null,[Validators.maxLength(200)]] }); 回答1: Is there a specific reason to use an enum? I think

问题 Is there a way to tie an Enum to Formbuilder names? Below, is an enum, and want to convert enum to its string, and use with Formbuilder (rather than using strings in formbuilder) Is this possible in Angular? enum address{ city, state, zip } this.addressForm = this.formBuilder.group({ 'city': [null, [Validators.required, Validators.maxLength(200)]], 'state': [null, [Validators.maxLength(200)]], 'zip':[null,[Validators.maxLength(200)]] }); 回答1: Is there a specific reason to use an enum? I think

问题 I am making angular application with reactive form, where i have made a nested form array which will get nested on button click. A clean working example https://stackblitz.com/edit/angular-thhczx , it has static inputs and hence on click over Add new template , it will add a another nested part and for Add new property , it will generate another property array.. So you had got the above working example concept right?? I would like to have the same json but not with add button and with

问题 I have a form control that is as following: .... direction: new Form("", [Validators.pattern("^[0-9]*$")],[requiredAsyncValidator]) and the requiredAsyncValidator is export const requiredAsyncValidator = (control:FormControl):Promise<any> | Observable<any> => { return new Promise<any>((resolve,reject) => { setTimeout(() => { if(control.value == '' && control.touched) { resolve({required:true}) } else{ resolve(null) },100) }) } in my html I have attached (blur)="direction

问题 I would like to implement a mat-stepper, every step is in a different component, my problem is to prevent the next button is clicked if the step is not completed: parent.html: <mat-horizontal-stepper> <mat-step [stepControl]="stepOneForm [completed]="stepOneForm?.valid"> <ng-template matStepLabel>Step1</ng-template> <child-step-1 [stepOne]="stepOneForm" (stepOneEmitter)="updateStepOne($event)"> </child-step-1 > </mat-step> <mat-step [stepControl]="stepTwoForm [completed]="stepTwoForm?.valid">