How to render dynamic HTML in Angular

Question

How to render dynamic html inside {{ name }}?

let fname="faisal";
data1="<h1>{{fname}}</h1>";

let lname="Khan";
data2="<h1>{{lname}}</h1>";

how to get output like this : {{ data1 }} {{ data2 }} = faisal khan

Why don't you put the h1 into the template, then do <h1>{{ fname }} {{ lname }}</h1>? That way you'll only have a single element, too. — jonrsharpe
– jonrsharpe, Commented Jun 30, 2019 at 13:40

Hien Nguyen · Accepted Answer · 2019-06-30 15:00:33Z

0

You can display your full name without data1, data2

If you have data1, data2 you need style for h1 display: inline-block

<h1>{{fname}} {{lname}}</h1>

answered Jun 30, 2019 at 14:51

Hien Nguyen

19k7 gold badges57 silver badges70 bronze badges

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

1 Answer 1