Pass script in angular scope

Question

Hi I'm trying to pass a javascript code through angular scope but on view page it renders as text. I also tried ng-Sanitize but it also didn't work.

&lt;div id=&quot;xv-embed-13042533&quot;&gt;&lt;/div&gt; &lt;script type=&quot;text/javascript&quot;&gt; (function() { var tn = document.createElement(&#39;script&#39;); tn.type = &#39;text/javascript&#39;; tn.async = true; tn.src = &#39;http://flashservice.example.com/embedcode/13042533/510/400/embed.js&#39;; var s = document.getElementById(&#39;xv-embed-13042533&#39;); s.parentNode.insertBefore(tn, s); })(); &lt;/script&gt;

But on View page it renders as text in below format

<div id="xv-embed-13042533"></div> <script type="text/javascript"> (function() { var tn = document.createElement('script'); tn.type = 'text/javascript'; tn.async = true; tn.src = 'http://flashservice.example.com/embedcode/13042533/510/400/embed.js'; var s = document.getElementById('xv-embed-13042533'); s.parentNode.insertBefore(tn, s); })(); </script>

I'm using below syntax

<div id="Div2" ng-bind-html="htmltext2"></div> <br/>

Read the tag descriptions!

too honest for this site
– too honest for this site

2015-07-25 11:50:57 +00:00
Commented Jul 25, 2015 at 11:50 — too honest for this site
– too honest for this site, Commented Jul 25, 2015 at 11:50

Estus Flask · Accepted Answer · 2015-07-26 06:30:44Z

0

You should use $sce.trustAsHtml

$scope.unsafeHtml = $sce.trustAsHtml('<script>...<\/script>');

in conjunction with ng-bind-html

<div ng-bind-html="unsafeHtml"></div>

However, the above will not work, because jqLite doesn't handle <script> correctly. You have to resort to such workaround or load jQuery before Angular, so jQuery would be used as angular.element instead of jqLite.

Here's an example.

edited Jul 26, 2015 at 6:30

answered Jul 25, 2015 at 9:14

Estus Flask

226k79 gold badges478 silver badges620 bronze badges

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

2 Comments

rahlrokks Over a year ago

I have already created "sanitize" filter but that's not working

Estus Flask Over a year ago

You didn't provide fully testable example. Here's a working one, it does exactly the same as the answer says plnkr.co/edit/iVre7ZZuBPZvY6XJcOvh?p=preview

Collectives™ on Stack Overflow

Pass script in angular scope

1 Answer 1

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related