动态生成标题标签

Question

我很好奇如何在Angular中动态生成标题标签。让我向您解释整个场景。假设我有一个客户机-服务器设置，其中我能够以json的形式从服务器检索数据，并且在该数据中有一个名为"size“的字段。现在，我想知道的是，有没有什么方法可以使用我的json中的size数据动态生成标题标记？例如，如果我从我的json数据中得到size: 2，那么相应的标题标签应该是<h2>.

<li *ngFor="let data from jsonData" [ngSwitch]="data.type" class="list-group-item">
    <h(what code should go over here to generate the heading accoring to the size parameter passed?) *ngSwitchCase="'SomeType'">{{data.text}}</h(?)>
</li>

Answer 1

我不确定你是否能做到这一点。作为替代，您可以创建一个单独的组件，该组件可以根据您传递给它的参数/条件生成适当的header标记。例如：

假设您有一个名为header-tag的组件。

<header-tag [someType]="typeValue"></header-tag>

在header-tag模板中：

<h1 *ngIf="typeValue === h1">Some Text</h1>
<h2 *ngIf="typeValue === h2">Some Text</h2>
...