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 내부를 제외한 다른 위치에 템플릿을 배치하는 것입니다. 귀하의 경우에는 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>