Edit 2022: Read a more modern way with @Cichy’s answer below Modify the show search method like this showSearch(){ this.show = !this.show; setTimeout(()=>{ // this will make the execution after the above boolean has changed this.searchElement.nativeElement.focus(); },0); }
It means that you have to add multiple validators in array . Example: With Error profileFormGroup = { budget: [null, Validators.required, Validators.min(1)] }; Above one throws error that validator to return Promise or Observable Fix: profileFormGroup = { budget: [null, [Validators.required, Validators.min(1)]] }; Explanation: In angular Reactive form validation done by using in-built validators which … Read more
If ngForm is used, all the input fields which have [(ngModel)]=”” must have an attribute name with a value. <input [(ngModel)]=”firstname” name=”something”> Standalone By setting [ngModelOptions]=”{standalone: true}” one tells Angular something like, ignore the form and/or ngForm, just bind it to firstname variable please. However, if form-tag was used by mistake (like in my case … Read more
In order to use two-way data binding for form inputs you need to import the FormsModule package in your Angular module. import { FormsModule } from ‘@angular/forms’; @NgModule({ imports: [ FormsModule ] EDIT Since there are lot of duplicate questions with the same problem, I am enhancing this answer. There are two possible reasons Missing … Read more
While using formControl, you have to import ReactiveFormsModule to your imports array. Example: import {FormsModule, ReactiveFormsModule} from ‘@angular/forms’; @NgModule({ imports: [ BrowserModule, FormsModule, ReactiveFormsModule, MaterialModule, ], … }) export class AppModule {}