angular-forms

I've got two sections of forms - correspondence address and residential address. The goal is to copy/pass values from one field to another if a checkbox is checked. Kindly see below use case populate the correspondence address fields with the values of the residential address form fields iff a checkbox (same as residential address) is checked Should any form field in the residential address change after checking the checkbox, pass the change(s) realtime to the field in the correspondence address and lastly, clear the form values in the correspondence address if the checkbox is unchecked. Below

This issue faced when using mat-datepicker inside *ngFor . mat-datepicker requires a template reference variable #test in order to bind to the input . Is there a direct way to take reference variables when using inside *ngFor , in general? I couldn't find a way. Simple working example without *ngFor <mat-form-field> <input matInput [matDatepicker]="test" placeholder="Enter Date" [(ngModel)]="someDate" name="someDate"> <mat-datepicker-toggle matSuffix [for]="test"></mat-datepicker-toggle> <mat-datepicker #test></mat-datepicker> </mat-form-field> But since template reference variables must be

The inputs are inside of a modal dialog. I have no idea why it is not working. I looked at the official docs and it listed focus as something you can pass to the element but it's not working? Does anyone know why? Angular Material - Input Docs <form class="example-form"> <md-input-container class="example-full-width" style="width: 300px; padding: 5px; border-radius: 10px;"> <input mdInput type="email" name="to" placeholder="Email"> <md-error></md-error> </md-input-container> <md-input-container focus focused> <input mdInput type="text" name="a" placeholder="zzzz" focus focused (focus)=""> </md

I am converting a purchased, third-party template into an Angular 5 app, and just ran into an error. I am very new to Angular 5 (I know AngularJS well however) and don't understand what it's trying to tell me? It seems to be related to a button which shows/hides the top navbar. Error Message (from browser): Error: Template parse errors: No provider for ControlContainer ("imalize-styl-2 btn btn-primary " (click)="toggleNavigation()"><i class="fa fa-bars"></i> </a> [ERROR ->]<form role="search" class="navbar-form-custom" method="post" action="#"> <div class="form-gro"): ng:///AppModule

I want to get the values from my checkboxes but I can only get true or false. Here is my template: <h4>Categories</h4> <div class="form-check" *ngFor="let cat of categories$|async"> <input class="form-check-input" [(ngModel)]="cat.id" name="{{ cat.name }}" type="checkbox" id="{{cat.name}}"> <label class="form-check-label" for="{{cat.name}}"> {{cat.name}} </label> </div> Here is my component this.categories$ = this.storeService.getAllCategories().pipe( map(result => (result as any).data), tap(r => console.log(r)) ) My component basically gets a list of the categories from an external api You

are reactive forms the way to go in order to have a component that can listen for changes in the validity status of the form it contains and execute some compoment's methods? It is easy to disable the submit button in the template using templateRef like [disabled]="#myForm.invalid" , but this does not involve the component's logic. Looking at template forms' doc I did not find a way Sravan 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) ); }