基于两个不同文本的模板逻辑

Question

需要根据布尔值显示两个不同的文本。

我试过这个

    <div name="health-plans" *ngIf="!flagon">
      Test<br />data
    </div>`

`        <div name="health-plans" *ngIf="flagon">
          Test data <br /> & value
        </div>

但是我需要根据条件用一个 div 来简化这一点。

Answer 1

角度17+

<div name="health-plans">
  @if (!flagon) {
    Test<br />data
  }
  @else {
    Test data <br /> & value
  }
</div>

角度<17

<div name="health-plans">
  <ng-container *ngIf="!flagon; else FlagonTemplate">
    Test<br />data
  </ng-container>

  <ng-template #FlagonTemplate>
    Test data <br /> & value
  </ng-template>
</div>