1

我无法使用 *ngIf/else 语句工作。这是设置:

<div *ngFor="let sub of day">
   <p>{{ sub.subject }}</p>
   <button type="button" *ngIf="sub.subject; else showElse" routerLink="/day" (click)="viewIndividual(day)" class="btn btn-{{colors[i]}}">View {{ daysBetween[i] | date:'EEEE' }}'s Plan</button>
   <ng-template #showElse>
      <a type="button" class="btn btn-primary">Add a Lesson</a>
   </ng-template>
</div>

问题是我的真实陈述正在呈现(带有 的按钮View {{ daysBetween[i] | date:'EEEE' }}'s Plan),但我的虚假值(ng-template)不是。我看过几个教程,我认为我做得对,但我现在才研究 Angular4 几天。请帮忙!

4

2 回答 2

0

我认为您应该再次检查您的*ngIf条件。我在我的代码中尝试过相同的工作。

TestObj = [
            {
                category : 'Test'
            }, {
                category : 'Test1'
            }
        ]

HTML 代码:

<div *ngFor="let key of TestObj">
    <p *ngIf="key.subcategory; else newText">** {{key.category}}</p>
       <ng-template #newText>No category found</ng-template>
</div>

由于这种情况,这显示No category found了两次。

注意: 如果要简化条件,可以通过检查组件中的主题条件并根据该条件设置标志 true 或 false 来完成。并在*ngIf中使用该标志。

于 2018-01-04T10:14:43.830 回答
0

您可以使用 angSwitch或者,因为您只有两种情况,所以直接使用两个ngIf

<div *ngFor="let sub of day">
   <p>{{ sub.subject }}</p>
   <button *ngIf="sub.subject" type="button" routerLink="/day" (click)="viewIndividual(day)" class="btn btn-{{colors[i]}}">View {{ daysBetween[i] | date:'EEEE' }}'s Plan</button>
   <a *ngIf="!sub.subject" type="button" class="btn btn-primary">Add a Lesson</a>
</div>
于 2017-12-04T07:59:52.927 回答