如何以角度呈现数组中的HTML答案

【问题标题】：How to render HTML which is in array in angular如何以角度呈现数组中的HTML
【发布时间】：2019-10-31 17:06:01
【问题描述】：

我有一个数组，其中一个对象包含 HTML 元素。我想以角度渲染它。

这是数组：

{
name: "rules", 
key: "rules", 
value_before: "<tr><td>revisit_in_some_days</td><td>less_then</td>td>r.input_data</td>"
}

我已经为 angular 尝试了多 for 循环。

我想要有角度的响应表。

【问题讨论】：

【解决方案1】：

你应该使用默认自带的 [innerHTML] 指令。喜欢：

<ul><li *ngFor="let res of trackLogList[key]" [innerHTML]="res"></li></ul>

【讨论】：

【解决方案2】：

假设您将 HTML 放在一个表格中，您可以在table 中使用[innerHtml]

<div *ngFor="let item of yourArray">
  <table [innerHTML]="item.value_before"></table>
</div>

【讨论】：

【解决方案3】：

您应该使用 angular 附带的 [innerHTML] 指令。用法：

data = [
  {
    value_before: '<div>some content</div>'
  },
  {
    value_before: '<div>some content1</div>'
  }
];

在您的 .html 中

<div *ngFor="let item of data">
  <div [innerHTML]="item.value_before"></div>
</div>

【讨论】：

是否可以为数组对象赋予样式，并将其呈现在前面？
是的，您可以将它作为对象来跟进[ngStyle] 指令，如[ngStyle]="{'color': '#fff'}"。这意味着您可以拥有对象属性style 并在其中拥有新对象style: {'color': '#fff'}，因此您可以在模板中使用它，例如<div [innerHTML]="item.value_before" [ngStyle]="item.style"></div>。希望我解释得对，如果不私下告诉我或在stackoverflow上写一个新问题。