angular directive not rendering

Question

i'm trying to include directives in my application, but even basic directives aren't rendering. what am i doing wrong?

angularloader.js:

var main = angular.module('ngMain', [])
.directive('myScrollable', function () {
return {
    restrict: 'AE',
    template: '<h3>Hello World!!</h3>'
};
});

My HTML:

<html ng-app dir="auto">
<head>
<meta name="viewport" content="width=device-width" />
<title>@Model.Title</title>
<script src="/Scripts/Libs/angular.js"></script>
<script src="/Scripts/Custom/angularloader.js"></script>
</head>
<body dir="auto">
<my-scrollable></my-scrollable>
</body>
</html>

tried also using tag or attribute ..

Shaishab Roy · Accepted Answer · 2015-08-24 12:07:02Z

2

you should use module name in ng-app="moduleName"

like:

<html ng-app="ngMain" dir="auto">

if you assign angular module in a variable then use that variable like bellow:

var main = angular.module('ngMain', []);
main.directive('myScrollable', function () {
return {
    restrict: 'AE',
    template: '<h3>Hello Worlds!!</h3>'
};
});

Working PLUNKER Link

edited Aug 24, 2015 at 12:07

answered Aug 24, 2015 at 11:54

Shaishab Roy

16.9k7 gold badges56 silver badges69 bronze badges

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

3 Comments

zanzamer Over a year ago

Thanks. Iv'e added the module name but it still remains: <my-scrollable></my-scrollable> Iv'e tried also linking the script from plunker but it didn't help..

Shaishab Roy Over a year ago

what is your angular version ? try 1.4.x

zanzamer Over a year ago

I'm using latest 1.4.4. i've tried also the script from plunkr 1.4.3 but the same. I'm using chrome 44.0.2403.157 m.

nitin · Accepted Answer · 2015-08-24 11:59:37Z

0

You have define your module but forget to use in html with ng-app= "you module Name". One extra thing you don't need to declare a variable main your code will work without that also.

angular
.module('myModule', [])
.directive('myDir', function{
  your code
});

answered Aug 24, 2015 at 11:59

nitin

1562 silver badges13 bronze badges

Collectives™ on Stack Overflow

angular directive not rendering

2 Answers 2

3 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related