Angular 如何将ngSwitch与模板一起使用？

我有IF语句的模板：

<li *ngIf="activity.entity_name == 'Project'" [activity-project-item]="activity"></li>
<li *ngIf="activity.entity_name == 'Tooling'" [activity-tooling-item]="activity"></li>
<li *ngIf="activity.entity_name != 'Project' && activity.entity_name != 'Tooling'" [activity-item]="activity"></li>

如何使用ngSwitch指令编写此模板

例如，此模板存在分析错误“嵌入模板上的组件”：

并且此模板存在解析错误“无NgSwitch提供程序”：

模板

<li [ngSwitch]="activity.entity_name">
  <template [ngSwitchCase]="'Project'">Content here</template>
  <template [ngSwitchCase]="'Project2'">Other content here</template>
  <template ngSwitchDefault>Content if nothing matched</template>
</li>

一种可能性：

<li [ngSwitch]="activity.entity_name">
  <template [ngSwitchCase]="'Project'">Selected Project</template>
  <template [ngSwitchCase]="'Tooling'">Selected Tooling</template>
  <template ngSwitchDefault>Or else...</template>
</li>

选定项目
选定的工具
否则。。。

替代语法：

<div [ngSwitch]="activity.entity_name">
  <li *ngSwitchCase="'Project'">Selected Project</li>
  <li *ngSwitchCase="'Tooling'">Selected Tooling</li>
  <li *ngSwitchDefault>Or else...</li>
</div>

所选项目
所选工具
或者

---

请看和。

这是正确答案。在Angular 8中，这在使用[ngSwitchCase]而不是*ngSwitchCase的组件内部工作。查看Xameramir的回应，了解发生了什么：从角度看：“NgSwitch本身不是一个结构指令。它是一个属性指令，控制其他两个开关指令的行为。这就是为什么要编写[NgSwitch]，而不是*NgSwitch。”

@NgModule({
    ...
    imports: [CommonModule...],
    declarations: [ThisComponent...],
    ...
})
export default class MyModule {}

<li [ngSwitch]="activity.entity_name">
  <template [ngSwitchCase]="'Project'">Selected Project</template>
  <template [ngSwitchCase]="'Tooling'">Selected Tooling</template>
  <template ngSwitchDefault>Or else...</template>
</li>

<div [ngSwitch]="activity.entity_name">
  <li *ngSwitchCase="'Project'">Selected Project</li>
  <li *ngSwitchCase="'Tooling'">Selected Tooling</li>
  <li *ngSwitchDefault>Or else...</li>
</div>