Angular js templates do not call <script> tags. Behavior by design?

Showing 1-11 of 11 messages
Angular js templates do not call <script> tags. Behavior by design? Scott Motte 10/15/12 8:25 PM
Angularjs has been great. Is the following behavior by design?

When rendering angular js templates I find that a <script\> tag is not called. 

Here is an example simulating the behavior: http://jsfiddle.net/LEmVF/10/

As you can see, I cannot embed the stripe button inside an angular.js template. Is this something I should use a directive for?
Re: Angular js templates do not call <script> tags. Behavior by design? m48u 10/16/12 1:59 AM
I had the same problem but couldn't find a way to archieve this. Maybe it's a XSS/security issue.

But anyways it would be better design to separate templates from model functionality. In your template 
just call a method from the scope to get your functionality


Cheers
Re: Angular js templates do not call <script> tags. Behavior by design? umesh nakod 9/18/14 11:37 AM
after a long time am geeting this problem actually i want to write a directive in which template i have to use <script> tag so guys do you get any clue about this

please help me..

Re: Angular js templates do not call <script> tags. Behavior by design? Sander Elias 9/18/14 9:57 PM
Hi Umesh,

script tags are stripped from the templates as a security feature. And for good reasons. 
That does not mean you can't load scripts, it just means you can't use templates to
accomplish that goal.

What is the actual reason you think you need a script in your template? If you build a 
plunk around what you are trying to do, I can most likely provide a (couple of) alternative(s)
to you.

Regards
Sander
Re: Angular js templates do not call <script> tags. Behavior by design? Suresh 11/3/14 9:00 PM
Hi Sander,

Actually I'm facing similar issue here. I have a scenario where I have to load a script inside angular application.

I'm trying to embed google preview wizard script inside my angular application. No matter in what way i try it's just not happening. (https://developers.google.com/books/docs/preview-wizard). Any inputs on this ? 

So far I tried embedding it inside a directive, iframe, directly inside controller, and finally template (which stripes off scripts tags inside it).
Re: Angular js templates do not call <script> tags. Behavior by design? Sander Elias 11/4/14 3:37 AM

Hi Suresh,

Make an directive out of it.
Inside the directive you can check if the script is loaded, if not dynamically load the script using your script-loader of choice.
Once loaded (I would use a promise to keep track of that!) call the needed functions GBS_insertEmbeddedViewer('ISBN:0738531367',600,500) or something similar.

Regards
Sander

Re: Angular js templates do not call <script> tags. Behavior by design? Penkey Suresh 11/4/14 4:57 AM
Hi Sander, I tried using directives but the problem is when the script is getting rendered, it is rewriting the whole page and displaying only the icon. (It has the same effect of javascripts document.write function). 

Below is my directive. Any idea what is happening here ? Or any other approach I should try ?

<div data-embed-viewer="book.isbn"></div>

appCommonDirective.directive('embedViewer', ['$compile',function($compile) {
       
return {
            restrict
: 'AE',
           
template: '<div></div',
            replace
: true,
            scope
: {
                isbn
: '=embedViewer'
           
},
            link
: function(scope, el, attrs) {
               
var rawTmpl = '<h1></h1><script type="text/javascript"> GBS_insertPreviewButtonPopup('+scope.isbn+');</script>';
                scope
.$watch('isbn', function(val) {
                   
if (val) {
                       
var template = $compile(rawTmpl)(scope);
                        el
.html(template);
                   
}
               
})
           
}
       
}
   
}]);
Re: Angular js templates do not call <script> tags. Behavior by design? Sander Elias 11/4/14 7:16 AM
If you put it in a plunk, I will give you a solution.

Regards
Sander
Re: [AngularJS] Re: Angular js templates do not call <script> tags. Behavior by design? Penkey Suresh 11/4/14 11:08 PM
Hi, Please check this plunker http://plnkr.co/edit/PixXPav7VLvSuL6OdBpn?p=preview

There are total 4 cases in this. One is loading script (directly), through directive in the main view. Another is loading script (directly), through directive in a secondary view (Not the view where all scripts are loaded initially).  Please let me know where I'm getting it wrong. 

Thank you

--
You received this message because you are subscribed to a topic in the Google Groups "AngularJS" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/angular/9d-rhMiXDmg/unsubscribe.
To unsubscribe from this group and all its topics, send an email to ang...@googlegroups.com.
To post to this group, send email to ang...@googlegroups.com.
Visit this group at http://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.



--
Regards,
Penkey Suresh.
Re: [AngularJS] Re: Angular js templates do not call <script> tags. Behavior by design? Sander Elias 11/5/14 2:43 AM

Hi Suresh,

GBS_insertPreviewButtonPopup seems to be incompatible with AngularJS(or other frameworks for that matter!) at first sight. I don’t have the time now to dive in deeply.
However, I reviewed the documentation, and it seems to be an top-level function for the rest of the library. You can use the lower-level stuff quite well with AngularJS.

I hope this helps a bit,
Regards
Sander

Re: [AngularJS] Re: Angular js templates do not call <script> tags. Behavior by design? Penkey Suresh 11/5/14 3:07 AM
Thank you Sander. I'll look into it.

--
You received this message because you are subscribed to a topic in the Google Groups "AngularJS" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/angular/9d-rhMiXDmg/unsubscribe.
To unsubscribe from this group and all its topics, send an email to ang...@googlegroups.com.
To post to this group, send email to ang...@googlegroups.com.
Visit this group at http://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.



--
Regards,
Penkey Suresh.