Question

我的API返回html内容（我希望它-必须）。我想在Angular 2/7中将此内容呈现为html。

现在，我有

<div class="card-container" [ngClass]="type === 'bot' ? 'white' : 'blue'">
    <div class="header" >
        <b>{{name}}</b> 
        {{date}}
    </div>
    <ng-content></ng-content>
</div>

此处的目标是将ng-content呈现为html。

对于上下文，ng-content是这样的测试日期：11月19日，星期一

这个组件称为chat-card.component

它的父级称为chat-card-area.component

<div class="right-child">
    <app-chat-card type={{type}}>
        <ng-content></ng-content>
    </app-chat-card>
</div>

如果聊天卡区域是父项，那么父项就是chat.component，它具有

<div *ngFor="let message of messages">
    <app-chat-card-area type={{message.type}}>
    {{message.text}} // I want this to be rendered as html
    </app-chat-card-area>
</div>

关于如何执行此操作的任何想法？

Answer 1

在此处将innerHTML绑定用作：-

<div *ngFor="let message of messages">
    <app-chat-card-area type={{message.type}}>
      <div [innerHTML]="message.text"></div> // Will render as HTML
    </app-chat-card-area>
</div>

将ng-content渲染为html-Angular 2

1 个答案: