Routing issue in Angular JS

Question

i am just new to angular js and when I tried to study routing one error occurs.. please check this..

here is my index.html

<!DOCTYPE html>
<html data-ng-app="demoApp">

<head>
    <title>Angular</title>
    <link rel="stylesheet" href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.0.4/css/bootstrap-combined.min.css">
</head>

<body>
    <div class="container">
        <div class="row">
            <div data-ng-view=""> </div>
        </div>
    </div>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script>
    <script>
    var demoApp = angular.module('demoApp', []);
    demoApp.controller('firstController', function($scope) {
        $scope.customers = [{
            name: 'nik',
            city: 'san fransisco'
        }, {
            name: 'henry',
            city: 'new york'
        }, {
            name: 'avida',
            city: 'california'
        }, {
            name: 'lynda',
            city: 'texas'
        }];

        $scope.addCust = function($scope) {
            $scope.customers.push({
                name: $scope.newCust.name,
                city: $scope.newCust.city
            })
        }
    });
    demoApp.config(function($routeProvider) {
        $routeProvider
            .when('/view1', {
                controller: 'firstController',
                templateUrl: '1.html'
            })
            .when('/view2', {
                controller: 'firstController',
                templateUrl: '2.html'
            })
            .otherwise({
                redirectTo: '/view1'
            });
    });
    </script>
</body>

</html>

routing is not working, as it supposed to load "/view2" as default when i take index.html

I hope no need to include code from 1.html and 2.html here, for reference as that just contains the 'li' tag which shows the data from this.

Error is, angular.js:38Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.5.6/$injector/modulerr?p0=demoApp&p1=Error%3A…ogleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.5.6%2Fangular.min.js%3A39%3A222)

Thank.

user3227295 · Accepted Answer · 2016-06-16 19:31:36Z

2

you must include ng-route script angular-route

edited Jun 16, 2016 at 19:31

answered Jun 16, 2016 at 19:29

user3227295

2,1561 gold badge13 silver badges17 bronze badges

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

2 Comments

Ganesh Kumar G Over a year ago

but I see some examples working without adding this.. (following a video tut - in that just these code works!!)

ajmajmajma Over a year ago

@GaneshKumarG yeah but what version of angular are you using, and what version is the tutorial using. If you read the error url you have been provided it specifically tells you route is moved to its own module post 1.2, you are using 1.5 ... you need an injection, and in your case because you are using 1.5 you need the script as well.

Collectives™ on Stack Overflow

Routing issue in Angular JS

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related