In angular program $location giving error

Question

I have a simple program where I am trying to redirect use using a check on username and password. But when condition holds true I am not redirected but instead given an error. Can someone help me out?

SNIPPET:

<html>
<head>

 <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.5/angular.min.js"></script>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.5/angular-route.min.js"></script>

</head>

<body ng-app="myApp" ng-controller="myCtrl">
        Username: <input type="text"  ng-model="username"><br>
        Password: <input type="password" ng-model="password"><br>
        <button ng-click="submit()">LogIn</button>

<script>

    //module declaration
    var app=angular.module("myApp",['ngRoute']);

    //routing declaration
    app.config(function($routeProvider, $httpProvider){

        $routeProvider
        .when('/login',{
            templateUrl: 'login.html'
        })
        .when('/dashboard',{
            templateUrl: 'dashboard.html'
        })
        .otherwise({
            templateUrl: 'login.html'
        });

    });

    //controller declaration
    app.controller("myCtrl",function($scope, $location){

            $scope.submit= function(){

                if($scope.username=='admin' && $scope.password=="admin")
                {
                    $location.path('/dashboard');
                    //alert("Hi");
                }

            };
    });

</script>
</body>
</html>

ERROR:

Running the folder in XAMPP

http://stackoverflow.com/questions/30013618/angular-module-run-referenceerror-location-is-not-defined — Ralf de Kleine, Nov 21 '16 at 09:52
Ran locally using the snippet and it has worked fine, there must be some other code that is causing the error — George, Nov 21 '16 at 10:07

score 1 · Answer 1 · answered Nov 21 '16 at 10:18

<html>

<head>

  <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.5/angular.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.5/angular-route.min.js"></script>

</head>

<body ng-app="myApp" ng-controller="myCtrl">

  <ng-view></ng-view>
  Username:
  <input type="text" ng-model="username">
  <br>Password:
  <input type="password" ng-model="password">
  <br>
  <button ng-click="submit()">LogIn</button>

  <script>
    //module declaration
    var app = angular.module("myApp", ['ngRoute']);

     //routing declaration
app.config(function($routeProvider, $httpProvider){

    $routeProvider
    .when('/login',{
        templateUrl: 'login.html'
    })
    .when('/dashboard',{
        templateUrl: 'dashboard.html'
    })
    .otherwise({
        templateUrl: 'login.html'
    });

});

     //controller declaration
    app.controller("myCtrl", function($scope, $location) {

      $scope.submit = function() {

        if ($scope.username == 'admin' && $scope.password == "admin") {
          console.log("called")
          $location.path('/dashboard');
          //alert("Hi");
        }

      };
    });
  </script>
</body>

</html>

I think you forgot to give ng-view where partials(dashboard.html) will be loaded.And i didnt see any $location errors in your code.

Dont forget to pass login.html, dashboard.html and login.html files, when running the code. — Nikhil Mohanan, Nov 21 '16 at 10:24

In angular program $location giving error

1 Answers1