You are on the right track, you just need to add an actions item to displayedColumns list: displayedColumns = [“username”, “email”, “userFirstName” … , “actions”]; and: <ng-container cdkColumnDef=”actions”> <md-header-cell > Actions </md-header-cell> <md-cell *cdkCellDef=”let row” > <button md-raised-button >Edit</button> </md-cell> </ng-container>
To expand on Radim Köhler answer. here is a shorter way of writing that function. getControlName(c: AbstractControl): string | null { const formGroup = c.parent.controls; return Object.keys(formGroup).find(name => c === formGroup[name]) || null; }
I had the same situation for me to update FormGroup | FormArray at nested level controls. check this out(worked for me): /** * Re-calculates the value and validation status of the entire controls tree. */ function updateTreeValidity(group: FormGroup | FormArray): void { Object.keys(group.controls).forEach((key: string) => { const abstractControl = group.controls[key]; if (abstractControl instanceof FormGroup || … Read more
I’m currently using [ngValue] and it stores objects just fine. The explanation as to why you experienced issues using (change) instead of (ngModelChange) can be found in this question So, since you’ve already used [ngValue], you probably want to do something like this, where you will only use one way binding in order to be … Read more
In your component, define your radio button as part of your form: export class MyComponent { form: FormGroup; constructor(fb: FormBuilder){ this.form = fb.group({ gender: “” }); } } In your component HTML, construct your form: <div class=”form-group”> <label>Please select your gender</label> <div class=”row”> <label class=”md-check”> <input type=”radio” value=”female” name=”gender” formControlName=”gender”> Female </label> <label class=”md-check”> <input … Read more
If you want to get only the status and not the value you can use statusChanges: export class Component { @ViewChild(‘myForm’) myForm; this.myForm.statusChanges.subscribe( result => console.log(result) ); } If you even want data changes, you can subscribe to the valueChanges of the form and check the status of the form using this.myForm.status: export class Component … Read more
Component import { Component, ElementRef, ViewChild, AfterViewInit} from ‘@angular/core’; … @ViewChild(‘input1’, {static: false}) inputEl: ElementRef; ngAfterViewInit() { setTimeout(() => this.inputEl.nativeElement.focus()); } HTML <input type=”text” #input1>
import FormsModule in addition to ReactiveFormsModule
You can change the assignment of the variable to a setter method so that you’d have: set isDisabled(value: boolean) { this._isDisabled = value; if(value) { this.form.controls[‘name’].disable(); } else { this.form.controls[‘name’].enable(); } }
Just add type=”button” to it. A button without any defined type in a form acts like a submit button for the form.