angularjs module not working

Question

I am learning AngularJS. I am trying to list out the variable in controller. I have this in the script.

var demoController = angular.module('sampleController',[]);

demoController.controller('sampleController', function ($scope){
    $scope.customers=[
        {name:'John Smith', country:'Denmark', worth:'5000000'},
        {name:'John Lewis',country:'England',worth:'10000000'},
        {name:'Rick Evans',country:'America',worth:'6000000'}
    ];
});

And I have this in the HTML.

<html ng-app="demoController">
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script>

    <body>
        <h1>Applying filters</h1>
        <div ng-controller="sampleController">
            <ul>
                <li ng-repeat="cust in customers">{{ cust.name }} - {{ cust.country }} - {{ cust.worth | currency:"$":2 }}</li>
            </ul>
        </div>
    </body>
</html>

It is not listing out the variable. What is wrong with this script. Thanks!!

ng-app="demoController" when angular.module('sampleController',[]); ? — GillesC
– GillesC, Commented Mar 25, 2015 at 20:30

Community · Accepted Answer · 2020-06-20 09:12:55Z

5

You need to define your module in the right way

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

Then, use it in your HTML file

<html ng-app="app">

See it working on jsbin

Note that, the angular module's name is the one defined within the quotes

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

So, if you wrote var xModule = angular.module('app2',[]); your module name is app2 not xModule

edited Jun 20, 2020 at 9:12

CommunityBot

11 silver badge

answered Mar 25, 2015 at 20:29

Mohamed Shaaban

1,1896 silver badges13 bronze badges

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

1 Comment

oscilatingcretin Over a year ago

Including that empty array is key (as opposed to passing in the module name as the only argument).

Mowgli · Accepted Answer · 2015-10-02 18:22:30Z

Here is the code I am using :

<meta name="robots" content="noindex">
<html data-ng-app="app">
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script> 
<body>
<h1>Applying filters</h1>
<div data-ng-controller="sampleController">
<ul><li data-ng-repeat="cust in customers">{{ cust.name }} - {{ cust.country }} - {{ cust.worth | currency:"$":2 }}</li></ul>
</div>

<script id="jsbin-javascript">var app = angular.module('app',[]);

app.controller('sampleController', function ($scope){
    $scope.customers=[
        {name:'John Smith', country:'Denmark', worth:'5000000'},
        {name:'John Lewis',country:'England',worth:'10000000'},
        {name:'Rick Evans',country:'America',worth:'6000000'}
    ];
});
</script> 
</body></html>

And the output is :

Applying filters
{{ cust.name }} - {{ cust.country }} - {{ cust.worth | currency:"$":2 }}

Let me know what is missing here.

Collectives™ on Stack Overflow

angularjs module not working

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related