CODEWITHSUNDEEP
htmlangularselectdropdownhtml-select
Lucifer
Lucifer

Reputation: 76

Angular selected="selected" not working with [(ngModel)]

selected = "selected" is not working if used with [(ngModel)]

Find the code below:

HTML :

<div>
  <select class="dropdownlist" [(ngModel)]="DeviceModel" name="GensetModel">
    <option value="" selected="selected" disabled="disabled">test</option>
    <option *ngFor="let deviceModel of DeviceModelList" [value]="deviceModel">
      {{deviceModel}}
    </option>
  </select>
</div>

<p>You selected: {{DeviceModel}}</p>

TS :

 private _DeviceModel: string ;
  public get DeviceModel(): string {
    return this._DeviceModel;
  }
  public set DeviceModel(v: string) {
    this._DeviceModel = v;
  }
  // DeviceModel = '';
  DeviceModelList = ['option1', 'option2', 'option3'];

I want test as to be placeholder once the page loads.

I dont know whats the issue with my code ?

Thanks

Upvotes: 0

Views: 2995

Answers (1)

Mathew Berg
Mathew Berg

Reputation: 28750

Initialize your _DeviceModel to an empty string:

private _DeviceModel: string = '';

Here's a stcakblitz showing it:

https://stackblitz.com/edit/angular-2qybir?file=src%2Fapp%2Fapp.component.html

Upvotes: 1

Related Questions