Having some issues with setting default values in my Angular app using reactive forms. The defaults I set in ngOnInit are not showing up. I am also using the filter function within the map method.
I am trying to select a value based on the URL and have it displayed as default in a dropdown menu. Any suggestions would be greatly appreciated.
tMap = [
{ url: "test", Name:'rony' },
{ url: "cool", Name:'rocky' }
];
ngOnInit() {
this.loginForm.controls['hub'].setValue('rony');
this.url = (window.location.href).substring(22,26);
const selectedHub: { url:string, Name: string } =
this.tMap.filter(ele => ele.url == this.url)[0];
this.loginForm.controls['hub'].setValue(selectedHub.Name);
}
HTML Code:
<div>
<select formControlName="hub" ng-model="hub" id="login" class="form-control ng-pristine ng-valid ng-touched"
style="font-family: Arial; font-size: 12px; background-color: white; font-weight: 600">
<option *ngFor="let h of tMap"><a [href]="h.url">{{h.Name}}</a></option>
</select>
</div>