我正在使用 *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>
请帮忙,谢谢。
最佳答案
else 条件的模板应与 *ngIf 条件的模板级别相同。 当 *ngIf 为 false 时,当前元素将从 DOM 中删除。由于您的 ng-template 位于元素内部,因此它不适用于其他条件。
*ngIf else 工作的正确方法是将 else 模板放置在 DOM 层次结构中除 *ngIf 内部之外的任何位置。
了解更多信息:https://angular.io/api/common/NgIf#showing-an-alternative-template-using-else
根据您的情况,将代码更改为
<!-- 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>
关于angular - *ngIf 语句中 else 部分不执行,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46606175/