Monday, June 3, 2024
 Popular · Latest · Hot · Upcoming
181
rated 0 times [  186] [ 5]  / answers: 1 / hits: 17620  / 10 Years ago, wed, april 2, 2014, 12:00:00

I am trying to store a HTML inside a scope variable and then use it in template view. When I was reading how to do this in angular, I came across ng-bind-html. In that I've noticed that when I bind html tags with <a>, <strong>, etc.. it works. But I am unable to add <input> tags to it.



Meaning, this works:



$scope.myHtml = '<strong>This is <a hreaf=#>Something</a></strong>';


Template:



<p ng-bind-html=myHtml> </p>


But this doesnt work:



$scope.myHtml = '<input type=text />';


Template:



<p ng-bind-html=myHtml> </p>


The above is just a simplified sample for demonstration purpose only. My question is:



1) Does tags not work with ng-bind-html directive?



2) If not, how can I html bind a input tag so I can insert it inside the view?


More From » angularjs

 Answers
18

you are getting $sce:unsafe error...



this means you should use ng-bind-html-unsafe but newer version of angularjs does not include this directive anymore so you shoud use $sce.trustAsHtml() like this...



$scope.trustedInputHtml = $sce.trustAsHtml('<input type=text />');


but this way you cannot bind scope variables to your html so best way is writing a directive which can be replace with ng-bind-html-unsafe...



here is working PLUNKER for both $sce and directive examples...


[#71662] Tuesday, April 1, 2014, 10 Years  [reply] [flag answer]
Only authorized users can answer the question. Please sign in first, or register a free account.
patriciakiarrac

Total Points: 532
Total Questions: 100
Total Answers: 89

Location: Ivory Coast
Member since Sun, Mar 7, 2021
3 Years ago
;