Блог

Я пытаюсь использовать шаблон, который будет передан в качестве ng-контента в HTML-файле выбора компонента.

 <day-summary
  [data]="summary"
  *ngIf="(events.length)>=5;then busy;else notSoBusy"
  >You have <b>{{events.length}}</b> tasks to complete.</day-summary
>
<ng-template #busy>
  You seems busy today. You have <b>{{events.length}}</b> tasks to complete.
</ng-template>
<ng-template #notSoBusy>
  It seems like you have lot of free time. You have
  <b>{{events.length}}</b> tasks to complete.
</ng-template>
  

Я хотел бы показать его как занятое или не занятое. Он работает как занятый или не занят, но «сводка дня» component.html шаблон не работает.
Как я должен заставить это работать?

Рассмотрите возможность использования ng-contiainer , как показано ниже:

 <day-summary [data]="summary">
  <ng-container *ngIf="events.length >= 5; then busy; else notSoBusy"></ng-container>
</day-summary>

<ng-template #busy>
  You seems busy today. You have <b>{{events.length}}</b> tasks to complete.
</ng-template>
<ng-template #notSoBusy>
  It seems like you have lot of free time. You have <b>{{events.length}}</b> tasks to complete.
</ng-template>
  

Я думаю, вы хотите сделать это:

 <day-summary [data]=summary>
      You have <b>{{events.length}}</b> tasks to complete.
</day-summary>
<ng-container *ngIf="events.length >= 5">
      You seems busy today. You have <b>{{events.length}}</b> tasks to complete.
</ng-container>
<ng-container *ngIf="events.length < 5">
      It seems like you have lot of free time. You have <b>{{events.length}}</b> 
      tasks to complete.
</ng-container>
...
  

Поместите оба контейнера в положение, в котором вы хотите отобразить его условно. помимо ng-container вы можете использовать любой html-элемент вместо этого, чтобы вписаться в ваш макет.