CODEWITHSUNDEEP
javascriptangularjs
gespinha
gespinha

Reputation: 8487

Angular module is not working?

I have the following context of code. But for some reason it is returning an error that myApp is not defined, when I've defined it initially and am trying to use it in multiple situations with the mod variable.

What am I doing wrong?

https://jsfiddle.net/wL54j8g9/3/

angular.module('myApp', []);

var mod = angular.module('myApp');

mod.directive('myList', myDirective);
mod.directive('myObject', myObject);

function myDirective(){
    var opt = {
    restrict: 'E',
    template: '<ul><li>This is One</li><li>This is Two</li></ul>'
  };
  return opt;
}

function myObject(){
    var opt = {
    restrict: 'A',
    template: '<p>A Bouncing Before Park Me Bird Joe You\'re She Tell Toenails Mix Gox I Matter TV Battered You\'ll Vim Didn\'t Oh Snapped Silly</p>'
  };
  return opt;
}

Upvotes: 0

Views: 43

Answers (1)

Daniel Beck
Daniel Beck

Reputation: 21475

Two problems:

angular.module('myApp', []);
var mod = angular.module('myApp');

should just be

var mod = angular.module('myApp', []);

(Hm. Actually, after some experimentation, I see that that does still work the way you had it, provided you inject Angular correctly... a bit redundant though, I'd still suggest combining them.)

More significantly, in your fiddle, you were injecting Angular "onLoad" -- if you change that to "nowrap in <head>" it will work; see https://jsfiddle.net/rtrb8ngp/. The DOM element with ng-app needs to already exist when you instantiate your angular module (or else you need to use the bootstrap methods to init it.)

Upvotes: 2

Related Questions