angular-reactive-forms

I want to create dynamic checkbox based on object response,It should create multiple checkbox based on this response: test.json [ { "header":{ "serviceId":"inquiry-service", "productCode":"JPJXXX", "transactionId":"cfad2ac7c16XXX" }, "data":{ "items":[ { "offenceType4":"", "permSpeed":"110", "actSpeed":"123", "itemAttributes":{ "attribute5":"", "attribute4":"VQ3XXX", "attribute7":"14.21.00", "attribute6":"2018-03-22", "attribute1":"XXXXX", "attribute3":"XXXXXX", "attribute2":"XXXXXX" }, "offenceLoc":"XXXXXX", "itemNo":"1", "summonDate":"2018-04-02", "distCode":"XXXXXX", "summonType":"2",

I am making angular application with angular dynamic form where i am loading data for dynamic form through JSON.. JSON has two parts such as part 1 and part 2 , jsonDataPart1: any = [ { "elementType": "textbox", "class": "col-12 col-md-4 col-sm-12", "key": "project_name", "label": "Project Name", "type": "text", "value": "", "required": false, "minlength": 3, "maxlength": 20, "order": 1 }, { "elementType": "textbox", "class": "col-12 col-md-4 col-sm-12", "key": "project_desc", "label": "Project Description", "type": "text", "value": "", "required": true, "order": 2 } ] jsonDataPart2: any = [ {

I am making an application using angular 6, where i am using angular dynamic form. As of creating the form and submitting i have completed everything, You could able to see the working stackblitz , https://stackblitz.com/edit/angular-x4a5b6-hne6fg FYI: This form has children elemts which will gets opened and also gets append on click the add button and removes one by last on click the remove button.. The thing i am in the need is, i just need to patch the values to each inputs via service during edit of each row respectively.. Say i call the get service as, this.dynamicFormService.getRest(url

I'm trying to figure out how will i able to search in NGXS from different component. I have my searchbar from the navbar component while i'm displaying my data from app component which is a different component. Please see this stackblitz link CLICK HERE CODE this.peopleForm.get('name').valueChanges.pipe(debounceTime(500)).subscribe( (name: string) => { console.log(name); this.people$ = this.store.select(AppState.nameFilter(name)); } ) Having a look at your StackBlitz, it seems you are trying to filter a list based on what is entered in the peopleForm input element. Rather than tryring to

I'm trying to validate a password with the following regex: ^(?=.*[A-Z])(?=.*[a-z])(?=.*[0-9])(?=.{8,}) . Note that there is no terminating $ char, because that would prevent valid passwords from being accepted. (I'm not sure why the input field doesn't terminate the string). However, Angular's Validators.pattern adds the end of string char. And therefore my valid passwords fail. How do I prevent the pattern validator from adding the $ ? I suppose I could roll my own password validator, but surely there is a better solution...? EDIT: Passwords that should succeed: Test1234 tEst1234 tesT1234

im implementing reactive-form in angular. im unable to pass value from child to parent. example parent form: <div class="fields-wrap" [formGroup]="parent"> <div class="input-wrap"> <child-component></child-component> </div> <input type"button">Submit</div> </div> Child componet form: <div class="fields-wrap" [formGroup]="child"> <input type="text" formControlName="firstname" /> <input type="text" formControlName="lastname" /> <input type="text" formControlName="email" /> </div> how to get these child value when i click submit from parent component. can anyone help me? Instead of passing in

I am making angular 6 application, where i am using angular dynamic form and the values are coming from JSON.. Simple JSON : jsonData: any = [ { "elementType": "dropdown", "key": 'project', "label": 'Choose option to display', "options": [ { "key": 'inputbox', "value": 'Show Project Level as input box' }, { "key": 'dropdown', "value": 'Show Project Level as dropdown' } ], "order": 1 }, { "elementType": "textbox", "class": "col-12 col-md-4 col-sm-12", "key": "project_level", "label": "Project Level as input box", "type": "text", "value": "", "order": 2 }, { "elementType": "dropdown", "key":

I am using Angular 4 Reactive Forms to create a dropdown <select id="city" formControlName="city" (change)="onCitySelect($event)" > <option *ngFor="let city of cities" [ngValue]="city" > {{ city }} </option> </select> When a value is selected in the dropdown, I want to call a method and display the selected value. Here is my code to do this onCitySelect(event) { console.log(event.target.value); } I was expecting it to print the City name as shown in the dropdown. However, it seems it displays the index number as well. For instance, 2: London Instead of just London which is actually shown in