title: Angular (Typescript): How can I set option of selected to 'selected' if two-way binded?
body: <p>This is my html snippet:</p>
  
  <pre><code>  G Level 3:
    &lt;select [ngModel]="selectedg3" (ngModelChange)="selectG3Changed($event)"&gt;
        &lt;option [ngValue]="g3" *ngFor="let g3 of fetchService.gLevels3" [selected]="g3.name == selectedTask.glevel3.name"&gt;{{g3.name}}&lt;/option&gt;
    &lt;/select&gt;&lt;br&gt;
  </code></pre>
  
  <p>This is my typescript snippet:</p>
  
  <pre><code>  selectG3Changed(g3:GLevel){
      this.selectedg3 = g3;
    }
  </code></pre>
  
  <p>My <em>select</em> holds all options but keeps empty, it is not selecting the set option.</p>
  
  <p>But if I remove my <strong>binding</strong> like this:</p>
  
  <pre><code>  G Level 3:
    &lt;select&gt;
        &lt;option *ngFor="let g3 of fetchService.gLevels3" [selected]="g3.name == selectedTask.glevel3.name"&gt;{{g3.name}}&lt;/option&gt;
    &lt;/select&gt;&lt;br&gt;
  </code></pre>
  
  <p>it shows up the option which matches the <em>glevel3.name</em>. How can I combine the <strong>binding</strong> with <strong>[selected]</strong>?</p>