Loading a script using a custom angularjs directive

Question

I'm very new to angularjs. I want to load a script tag using a custom angularjs directive. Below is the example code for what I want to achieve:

angular.module('app')
  .directive('myScript', function () {
    return {
      restrict: 'E',
       template : function(e,a){
           return '<script>document.write(5 + 6);</script>';  
        }
    };
  });

So, 11 will be displayed when the directive is added in html:

<div><my-script></myscript></div>

But I couldn't manage to achieve that. So, I guess my code is wrong? Please help me with this. Thanks in advance.

Possible duplicate of the question below ..stackoverflow.com/questions/27533421/… — Vijay
– Vijay, Commented May 26, 2016 at 4:05

Carlos Henrique · Accepted Answer · 2016-05-26 04:15:27Z

0

All right, why would you like to do it by a script tag, Yin?

You can you a built-in directive to do this. Something like ng-bind or even curly braces {{}} AngularJs will evaluate your expression and set the tag value as the result.

Example: <span ng-bind="5 + 6"></span>

Result: <span>11</span>

Whenever you need to evaluate an expression you can do this way :)

answered May 26, 2016 at 4:15

Carlos Henrique

214 bronze badges

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

2 Comments

Yin Over a year ago

Thanks for the reply, Carlos. Above is just an example. If the script I want to load is more complicated, how should I load it using directives?

Carlos Henrique Over a year ago

Oh, got it. So, probably you would create a controller on your directive and use javascript to insert your script tag. An alternative, you could use something like ocLazyload to get your script. :)

Collectives™ on Stack Overflow

Loading a script using a custom angularjs directive

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