AngularJS code error - what am i missing?

Question

Learning Angular JS, and following video from http://www.youtube.com/watch?v=i9MHigUZKEM - i'm getting a AngularJS error, but have no idea what it is, and frankly, how to debug this thing.... using AngularJS 1.2.3, btw.

here's the main page:

<html data-ng-app="demoApp">
<head>
    <title></title>

</head>
<body >
<div>
<!-- placeholder for views -->
<div data-ng-view=""></div>
<!-- placeholder up to here -->
</div>
<script src="angular.min.js"></script>

    <script>

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

        demoApp.config(function ($routeProvider) {
            $routeProvider
                .when('/view1',
                {
                    controller: 'SimpleController',
                    templateUrl: 'Partials/view1.html'
                })
                .when('/view2/',
                {
                    controller: 'SimpleController',
                    templateUrl: 'Partials/view2.html'
                })
                .otherwise({ redirectTo: '/view1' });
        });

        demoApp.controller('SimpleController', function ($scope) {
            $scope.customers = [
                {name:'john',city:'phoenix'},
                {name:'jane',city:'sf'},
                {name:'jon',city:'Oakland'}
            ];

            $scope.addCustomer = function() {
                $scope.customers.push(
                    { 
                        name: $scope.newCustomer.name,
                        city: $scope.newCustomer.city
                    });
            };
        });


    </script>

</body>
</html>

and the view 1.html:

<div class="container">
    <h1>view 1</h1>
    Name: <br />
    <input type="text" data-ng-model="filter.name" />

    <ul>
        <li data-ng-repeat="cust in customers | filter:filter.name">{{ cust.name | uppercase }} - {{ cust.city | lowercase }}</li>
    </ul>
    <br />
    Customer Name:<br />
    <input type="text" data-ng-model="newCustomer.name" />
    <br />
    Customer City:<br />
    <input type="text" data-ng-model="newCustomer.city" />
    <br />
    <button data-ng-click="addCustomer()">Add Customer</button>
    <br />
    <a href="#/view2">View 2</a>
</div>

and View2.html

<div id="container" >
    <h1>view 2</h1>
    Name: <br />
    <input type="text" data-ng-model="filter.city" />

    <ul>
        <li data-ng-repeat="cust in customers | filter:filter.city">{{ cust.name | uppercase }} - {{ cust.city | lowercase }}</li>
    </ul>
</div>

what am i missing??

You did not declare your controller in any of your body elements, or body itself. <body ng-controller="SimpleController"> — Zack Argyle
– Zack Argyle, Commented Dec 3, 2013 at 19:40
@ZackArgyle - that's not it. i'm declaring my app in my html, and that includes the controller (tried putting it in there anyway, didn't work). — raingod
– raingod, Commented Dec 3, 2013 at 19:43
@tymeJV - i'm getting a generic AngularJS error, which something in my code is causing. but, that error message is as not helpful as can be: Uncaught Error: [$injector:modulerr] errors.angularjs.org/1.2.2/$injector/…… — raingod
– raingod, Commented Dec 3, 2013 at 19:44

eddiec · Accepted Answer · 2013-12-03 19:56:41Z

1

You need to make sure you're including angular-route.js, available here http://code.angularjs.org/1.2.3/angular-route.js

Also make sure you specify demoApp's dependancy on the ngRoute module.

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

If you follow that link you posted in your error message you'll see some details there.

edited Dec 3, 2013 at 19:56

answered Dec 3, 2013 at 19:47

eddiec

7,6465 gold badges36 silver badges36 bronze badges

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

1 Comment

raingod Over a year ago

you sir, get a (virtual) gold star. that was it - funny enough, i didn't even look at that error message, and didn't realize there was a link in there... Thank again!

Collectives™ on Stack Overflow

AngularJS code error - what am i missing?

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related