Angular пытается использовать ngModel для HTML-элемента

Question

Я пытаюсь сделать следующее:

    <div class = "form-group">
  <label for="funktion">Funktion</label>
  <select formControlName="funktion" id="funktion" class="form-control" ngModel #Funktion="ngModel" required >
    <option *ngFor="let Funktion of funktionen" value="{{Funktion.Name}}">{{Funktion.Name}}</option>
  </select>
</div>
<div *ngIf="Funktion.value == 'Administrator' ">
  Some Text here
</div>

Но получаю следующую ошибку:

Нет директивы с параметром exportAs, установленным в ngModel ("] # Funktion =Требуется «ngModel»>

Моя цель - показать, если функция со значением «Администратор» скрыто в раскрывающемся списке, и скрыть ее, если «Администратор» не выбран ...

Что я делаю не так?

Answer 1

<div class = "form-group">
  <label for="funktion">Funktion</label>
  <select class="form-control" formControlName="funktion" id="funktion"  [(ngModel)]='seletedValue' required >
    <option *ngFor="let Funktion of dataList" value="{{Funktion.value}}">{{Funktion.name}}</option>
  </select>
</div>
<div *ngIf="seletedValue == 'Administrator' ">
  Some Text here
</div>

Рабочий пример

Answer 2

У меня была такая же проблема, я решил ее с помощью

 <div class = "form-group">
    <label for="funktion">Funktion</label>
    <select formControlName="funktion" id="funktion" class="form-control" [(ngModel)]="myFuncName" #Funktion="ngModel" required >
       <option *ngFor="let Funktion of funktionen" value="{{Funktion.Name}}">{{Funktion.Name}}</option>
    </select>
</div>
<div *ngIf="myFuncName == 'Administrator' ">
   Some Text here
</div>

Answer 3

  <div class = "form-group">
      <label for="funktion">Funktion</label>
      <select formControlName="funktion" id="funktion" [(ngModel)]="Funktionname" class="form-control"  required >
       <option *ngFor="let Funktion of funktionen" value="{{Funktion.Name}}">{{Funktion.Name}}</option>
      </select>
  </div>
  <div *ngIf="Funktionname == 'Administrator' ">
    Some Text here
  </div>