angular-reactive-forms

问题 I am having an angular project developed using angular 5 and typescript . In my component's html template I have an text area box. I want to make the first few characters non editable in this text area. So for example from my components ts file i can set the initial value, for example : "RMO " to my text area . The user cannot remove the text "RMO " which is set in the text area. i have got some jquery code to achieve this (http://jsfiddle.net/zq4c873L/1/) and i convert it to typescript code.

问题 Seems like pipe doesn't work with reactive form control valueChanges. i've prepared this https://stackblitz.com/edit/angular-vdeqrz so that you can reproduce the problem. type something in the text field. then type "boom" (without the quotes). after the error catch, the control does not work any more. you can verify typing something new on it after that. it does not detect any other input. if you refresh the page, then it works again. am i missing something here ? 回答1: This is not a bug.

问题 I get JSON reponse from the server from which I take the metadata required to build the FormGroup object. Since the JSON is dynamic and so is FormGroup object, how to parse the JSON fields in HTML? I looked at the angular documentation for dynamic forms https://angular.io/guide/dynamic-form but here I see they are passing each class object to the dynamic-form-question.component.ts from the parent dynamic-form.component.ts My JSON: [ { "key": "Basic", "required": false, "controlType": "section

问题 I have this code in stackblitz that needs to get all materials. How can i get all the materials and not just one. The output is just one materials and not the lists? Here's my code below https://stackblitz.com/edit/angular-qssycg?file=app/app.component.ts JSON orders = [ { "id": 1, "name": "Not Available", "address": "Not Available", "city": "Not Available", "contact_number": "Not Available", "created_at": "2017-10-26 16:12:22", "updated_at": "2017-10-26 16:12:22", "materials": [ { "id": 21,

问题 What I want to achieve is something like this: When the user clicks on Submit button, in the background I need to compare if the state of the form has changed, by state I mean if there is at least one change in the form and only then call the API/Server to save information. If there are not any changes, just show a warning message to the user - "Hey you need to update something!"(console.log() is enough) *I also need to handle this case when the user changes something in the field1, for

问题 I have a feature where I need to send dynamically generated input fields on button click. I have recreated the problem on stackblitz for better understanding. In that app, when I enter resourceQuantity, the resourceId fields are dynamically generated. My issue is to identify those fields individually and send them on server side on single button click. This solution I've found on stackblitz is similar, but in my problem I am not removing or adding on button clicks, but (change) event instead.

问题 I have the reactive form in my angular project that defines like this: this.createUserFormGroup = new FormGroup({ 'userName': new FormControl(null, [Validators.required, Validators.maxLength(256)]), 'name': new FormControl(null, [Validators.required, Validators.maxLength(64)]), 'roleNames': new FormArray([]), 'password': new FormControl(null, [Validators.required, Validators.maxLength(32)]), 'confirmPassword': new FormControl(null, [Validators.required]) }); how can I check the matching of

问题 I'm working with Reactive Forms and I'm trying to pass my form down to child components, but I'm running into the error above. Initially at the top level of the form I was using a FormArray to hold my form and that was working fine before I tried passing it down to the child components. Thanks to this post I now know that the top level of a form should be a FormGroup and the FormArray should be a child of the FormGroup. So now I am nesting my FormArray inside of a FormGroup and I'm getting

问题 In my angular 6 application, i am making a reactive form which has, Html <form [formGroup]="form"> <h2>Click the add button below</h2> <button (click)="addCreds()">Add</button> <div formArrayName="credentials" > <div *ngFor="let creds of form.get('credentials').controls; let i = index" [formGroupName]="i" style="display: flex"> <select formControlName="action"> <option *ngFor="let option of options" value="{{option.key}}"> {{option.value}} </option> </select> <input placeholder="Name"

问题 I'm using Angular 6 with reactive forms. One of the form field is a FormArray which adds controls as the user clicks an Add button. Within the FormArray, I would like to check whether the FormControl value already exists in the FormArray. This works fine until the user clicks 'Add' button which resets the previous control error and marks the control as valid although it still has a duplicate value. This is the function to add control in the form array: onAddIPAddress() { if (( < FormArray >