javascript - Angular 路由无法正常工作

Question

我正在构建一个登录页面，其中用户有两个 Angular 色，即学生或图书管理员。当用户输入凭据并单击提交时，将调用验证函数。

现在，

我面临的问题是:

路由不起作用，即控件到达警报(“登录成功”)；并进入 if ($scope.roles[i].role === "student") { 但不会将页面定向到 $location.path('/home/student');

登录页面网址如下:

http://localhost:63342/LabguideExamples/Assignment/Day4/Login.html?_ijt=oa5emr702cenehrs4oosarmg0d

登录成功后的url如下。

http://localhost:63342/LabguideExamples/Assignment/Day4/Login.html?_ijt=oa5emr702cenehrs4oosarmg0d#/home/student

该网址仍然包含 Login.html，并且不会根据 app.js 被“ViewBooks_Student.html”替换。

非常感谢任何帮助。

谢谢

Controller .js

var Controllers = angular.module('Controllers', ['ngRoute']);
Controllers.controller('LoginCtrl', ['$scope','$http','$location',
function ($scope,$http,$location) {
    $scope.validate=function()
    {
        $http.get('data/roles.json').success(function(data) {
            $scope.roles = data;

        var count=0;
            for (var i = 0, len = $scope.roles.length; i < len; i++) {
if ($scope.username === $scope.roles[i].username && $scope.password === $scope.roles[i].password) {
                    alert("login successful");
                    count = count + 1;
                    if ($scope.roles[i].role === "student") {
                        $location.path('/home/student');
                        break;
                    }
                    else {
                        $location.path('/home/librarian');
                        break;
                    }

                }
            }

        if(count!=1)
        {
            alert("Please provide valid login credentials");
            $location.path( "/main" )
        }
        });
    }

}]);

app.js

var bookApp = angular.module('bookApp',[
'Controllers','ngRoute'
]);
bookApp.config(['$routeProvider',
function($routeProvider) {
    $routeProvider.
    when('/main', {
        templateUrl: 'Login',
        controller: 'LoginCtrl'
    }).
    when('/home/student', {
        templateUrl: 'ViewBooks_Student.html',
        controller: 'BookListCtrl_Student'
    }).
    when('/home/librarian', {
        templateUrl: 'ViewBooks_Librarian.html',
        controller: 'BookListCtrl_Librarian'
    }).
    when('/issue/:bookId', {
        templateUrl: 'IssueBook.html',
        controller: 'IssueBookCtrl'
    }).
    when('/return/:bookId', {
        templateUrl: 'ReturnBook.html',
        controller: 'ReturnBookCtrl'
    }).
    otherwise({
        redirectTo: '/main'
    });
}]);

Answer 1

这是一个很深入的问题。据我了解，登录后您需要重定向到基于用户 Angular 色的页面。因此，您在 Controller 上编写的这个特定逻辑需要写入 Angular Run block

angular.module('myapp').run([],function(){})

基本上，Angular 有一个优先执行系统运行 block 在 Controller 之前执行。有关更多详细信息，请查看 Angular 文档。 https://docs.angularjs.org/guide/module 。