angular-reactive-forms

问题 I understand this is a very stupid question and for someone with my SOF reputation should not be asking.Howvever I am pulling my hair and can't seem to understand what I am doing wrong. I am referring to an example on Stackblitz to create reactive form. In Stackblitz everything seems fine and my code works fine too.But in vs code I see error Identifier 'nameType' is not defined. '__type' does not contain such a memberAngular Code : <div> <label>Name Type</label> <mat-select formControlName=

问题 I am trying to create a reactive form from indexes extracted from an array of data. Lets say I have the following array: array = [ { name: 'Ali', gender: 'Male' }, { name: 'Sara', gender: 'Female' } ]; I extracted the index as following: this.result = new Set(this.array.flatMap(e => Object.keys(e), [])); this.result = Array.from(this.result); And the result: console.log(this.result) // ["name", "gender"] Now I need to loop over this.result and create 2 form control names with formControlName=

问题 I'm using Reactive Form with Custom Form Control in my Angular 9 application. I wrapped my ng-select control with Custom Form Control. And I have problem with validation. I set formControl to be required. Documentation says that ng-invalid css class should be set to ng-select automatically. But in fact with custom form control it doesn't work properly. The css class is not set, but the wrapper class is. Am I doing something wrong or this is library issue? Check stackblitz: https://stackblitz

问题 I trying to build an Angular Reactive form where an account can add many students. The form seems to work. When you hit Add Student it creates a new student but you check the console it says ERROR Error: Cannot find control with path: 'studentsArray -> 1 -> firstName and so on for each control in the array. app.component.html <form [formGroup]="accountForm"> <div> <input formControlName="firstName" placeholder="First name"> </div> <div> <input formControlName="lastName" placeholder="Last name

问题 I trying to build an Angular Reactive form where an account can add many students. The form seems to work. When you hit Add Student it creates a new student but you check the console it says ERROR Error: Cannot find control with path: 'studentsArray -> 1 -> firstName and so on for each control in the array. app.component.html <form [formGroup]="accountForm"> <div> <input formControlName="firstName" placeholder="First name"> </div> <div> <input formControlName="lastName" placeholder="Last name

问题 I am displaying a FormArray with an *ngFor. What i am trying to do is when i click on an item in the ngFor, to populate the with that items 'task' property. Additionally, when i type/update the contents of input, the original form is updated/patched. HTML: <form [formGroup]="myForm"> <div [id]="i" class="example-box" *ngFor="let item of myForm.get('items').controls; let i=index;" (click)="updateInput(item)"> {{item.value.task}} to be </div> <br> <br> <input formControlName="xxx" /> <br> <br>

问题 The ng-bootstrap typeahead element allows fetching an array of object suggestions and then selecting one so that the model becomes the selected object. The full code can be seen in this Plunkr. Test it by searching for a US state then observing the model output. Here is the template: <label for="typeahead-template">Search for a state:</label> <input id="typeahead-template" type="text" class="form-control" [(ngModel)]="model" [ngbTypeahead]="search" [resultTemplate]="rt" [inputFormatter]=

问题 I have following template for input fields in multiple forms (please ignore objToKeys - it is custom pipe and it works) : <div [formGroup]="form"> <ion-item> <ion-label color="primary" position="floating">{{ label }}</ion-label> <ion-input type="text" formControlName="{{ controlName }}"></ion-input> </ion-item> <div *ngIf="form.controls[controlName].touched && form.controls[controlName].errors" class="form-error-messages"> <div *ngFor="let key of form.controls[controlName].errors | objToKeys"

问题 Is there any way to disable the entire form in angular when using Reactive forms. I know it is possible to make them disable one by one. this.tempForm = this.fb.group({ m26_type: '', m26_name: '' }) this.tempForm.get('m26_type').disable(); Is it possible to disable the whole form rather than make every controller disable separately? 回答1: this.tempForm.disable(); Disables the control. This means the control will be exempt from validation checks and excluded from the aggregate value of any

问题 In db table, I have "key_name" which is successfully returning in API and working great. What I want to do is to set those fields value as a formControlName in html and in component I am using the reactive form so I have tried formArrayName . Based on the change event I am pushing new formControl in categoryArray and assigning its key as db field's value. here is my Html: <div class="col-md-6"> <div formArrayName="categoryArray" *ngFor="let type of types; let k = index"> <div [formGroupName]=