else部分が* ngIf文で実行されない

Question

*ngIf文を使用していますが、問題が発生しています。else部分は実行されません。私はなぜ、ここにソースコードがあるのか​​分からない。

<form [formGroup]="reviewForm" (ngSubmit)="onSubmit()"> 
    <div formArrayName="controlArray"> 
     <div class="form-group" 
      *ngFor="let control of reviewForm.get('controlArray').controls; let i = index">  
      {{control.value}}      
      <span *ngIf="control.value!='dropdown';else addDropDown">         
       <input type="{{control.value}}" 
         class="form-control" 
         [formControlName]="i" />         
       <ng-template #addDropDown> 
        <p>hello world</p> 
        <select class="form-control"     
          [formControlName]="i"> 
        </select> 
       </ng-template> 
      </span> 
     </div> 
    </div> 
</form> 

ご協力ありがとうございました。

Answer 1

else条件のテンプレートは、* ngIf条件と同じレベルである必要があります。 * ngIfがfalseの場合、現在の要素はDOMから削除されます。あなたのng-templateは要素内にあるので、else条件では使用できません。

他の* ngが動作する正しい方法は、DOMの階層の* ngIf内以外の場所にあるelseテンプレートがあることです。あなたのケースではhttps://angular.io/api/common/NgIf#showing-an-alternative-template-using-else

私はちょうどのない子、他のテンプレートは* ngif条件と同じレベルであってはならないと考えてい

<!-- If Template --> 
<span *ngIf="control.value!='dropdown';else addDropDown">         
      <input 
       type="{{control.value}}" 
       class="form-control" 
       [formControlName]="i">         
</span> 

<!-- Else Template --> 
    <ng-template #addDropDown> 
       <p>hello world</p> 
       <select `enter code here` 
       class="form-control"     
       [formControlName]="i"> 
       </select> 
    </ng-template>