默认情况下，选择标签选择一个值Angular Typescript

Question

I want one value to be selected by default.

This is stackblitz link : https://stackblitz.com/edit/angular-lwculd

HTML PART :

<select [(ngModel)]="selected" (ngModelChange)="onSelect(selected)" class="form-control">

        <option selected="Select" *ngFor="let status of statuses" [value]="status">
          {{ status }}
        </option>
      </select>

TS PART :

 statuses = ['Select', 'Enable', 'Temporary Disable', 'Permanent Disable', 'Lock User', 'Auto Disable'];

  onSelect(val) {
    console.log(val);
  }

Answer 1

In your app.component.ts , simply initialize selected with the value you want to be selected by default:

  statuses = ['Select', 'Enable', 'Temporary Disable', 'Permanent Disable', 'Lock User', 'Auto Disable'];
  selected = this.statuses[0]; // <-- add this line
  // You could also write : selected = 'Select';