Typescript concat string to draw Html

Question

In Angular2 v4 I have an array with multiple items. For example:

const array = ['1', '2', '3'];
array.forEach(h => {
  this.htmlhistory.concat('hello <br>');
});

the htmlhistory item is a string

and in my html component I have this:

<div>
  {{ this.htmlhistory }}
</div>

So the result have to be:

<div>
  hello <br>
  hello <br>
  hello <br>
</div>

BUT this doesn't works... What I'm doing wrong? Is there anothes solution without using *ngFor?

I need a solution in the component.ts file ... not in the html file

Please help

Vash72 · Accepted Answer · 2018-09-25 22:45:02Z

1

Instead of

<div>
  {{ this.htmlhistory }}
</div>

Use this

<div [innerHTML]="htmlhistory">
</div>

answered Sep 25, 2018 at 22:45

Vash72

6225 silver badges13 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Maciej21592 · Accepted Answer · 2018-09-25 22:40:48Z

0

If you want to render HTML in your component you are expected to use [innerHTML]="htmlhistory" not {{}} syntax.

Here is a quick example, in case you needed it.

answered Sep 25, 2018 at 22:40

Maciej21592

1142 silver badges14 bronze badges