Angular 2, set default value to select option
<p>I try to add a default value to an option. It will be like a kind of placeholder and I use <a href="https://stackoverflow.com/questions/5805059/how-do-i-make-a-placeholder-for-a-select-box">this method</a> to do it.
In pure HTML it work, but if I try to use <code>*ngFor</code> of angular 2 attribute, it doesn't select anything.</p>

<p>Here my code that I use in pure HTML:</p>

<pre><code>  &lt;select name="select-html" id="select-html"&gt;
    &lt;option value="0" selected disabled&gt;Select Language&lt;/option&gt;
    &lt;option value="1"&gt;HTML&lt;/option&gt;
    &lt;option value="2"&gt;PHP&lt;/option&gt;
    &lt;option value="3"&gt;Javascript&lt;/option&gt;
  &lt;/select&gt;
</code></pre>

<p>And using Angular template:</p>

<pre><code> &lt;select name="select" id="select" [(ngModel)]="selectLanguage"&gt;
    &lt;option *ngFor="let item of selectOption" 
      [selected]="item.value==0" 
      [disabled]="item.value==0"&gt;{{item.label}}&lt;/option&gt;
  &lt;/select&gt;
</code></pre>

<p>The class is</p>

<pre><code>import {Component} from '@angular/core';

@Component({
  moduleId: module.id,
  selector: 'app-form-select',
  templateUrl: 'default.component.html'
})
export class DefaultComponent {
  private selectOption: any;
  constructor() {
    this.selectOption = [
      {
        id: 1,
        label: "Select Language",
        value: 0
      }, {
        id: 2,
        label: "HTML 5",
        value: 1
      }, {
        id: 3,
        label: "PHP",
        value: 2
      }, {
        id: 4,
        label: "Javascript",
        value: 3
      }
    ]
  }
}
</code></pre>

<p>I want <code>Select Language</code>to be selected as a default value. It's disabled but not selected.</p>

<p>How can I select it as a default value?</p>

<p><strong><a href="http://plnkr.co/edit/fuMlp7XE8tDlDYLoOfni?p=preview" rel="noreferrer">Live example</a></strong></p>