Kunal Dholiya
Kunal Dholiya

Reputation: 385

How to render HTML which is in array in angular

I have a array in which one of the object contains HTML element. I wanted to render it in angular.

This is the array:

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

I've tried multi for loops for angular.

I want table of the response in angular frontened.

Upvotes: 1

Views: 4911

Answers (3)

Pramod kushwaha
Pramod kushwaha

Reputation: 449

you should use [innerHTML] directive that comes with angular by default. Like:

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

Upvotes: 2

Adrita Sharma
Adrita Sharma

Reputation: 22203

Assuming you will be placing the HTML inside a table,you can use[innerHtml] in table

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

Upvotes: 0

Nikola Stekovic
Nikola Stekovic

Reputation: 635

you should use [innerHTML] directive that comes with angular. Usage:

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

in your .html

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

Upvotes: 5

Related Questions