Dynamic HTML for Ionic HTML element

[Andy Parker]

Can you tell me how I can create dynamic HTML for an HTML element in IONIC please?

I have tried the following, but it is treated as text:

-- in the HTML element I added {{srcHTML}} which is the scope variable I fill with the html I require.

I've tried using srcHTML as the ng-src and as the ng-model but this doesn't work either.

I've also tried ng-bind-html, and although this shows the correct text, it still lacks the color formatting that I have added. If I place the dynamically create HTML in the HTML element it works, all colored correctly, but now when using ng-bind-html, its as if the HTML parts are ignored.....

[Serhii Kulibaba]

Hello Andy,

Please use directive ng-bind-html to add dynamic html to your app. Could you clarify, what exactly cdoesn't work there?

[Andy Parker]

thanks, I've tested ng-bind-html, it ignores html commands, eg

code
%children%
<h2 style="color:red;">I am red</h2>
<h2 style="color:blue;">I am blue</h2>
/code

the above placed in the html element directly shows the colored text, but, if you place this html in a scope variable and use ng-bind-html you get the text but with no formatting, as if the html markup is ignored.

[Serhii Kulibaba]

Please use CSS classes there instead of inline CSS. In that case you will be able to use any style in the custom CSS file