angular $locationChangeStart 没有被正确调用，怎么办？

Question

我正在开发基于 Brian Ford 在 GitHub 上的 angular-express-blog 应用程序的 MEAN 应用程序。

我遇到的问题是我需要能够在 $locationChangeStart 上调用我的 UserService 服务，以检查是否有用户登录。我看到的大多数示例都让您在模块声明中设置$rootScope.$on('$locationChangeStart'...。这不允许我访问我的自定义服务，所以我的解决方案是将它放在控制器中并在我的主布局文件中调用它。

我已经这样设置了，但应用程序什么也没做。它甚至没有调用错误。你们有人能发现这段代码的问题吗？

这是我的 github repo.

LayoutCtrl.js：

angular.module('myApp').
    controller('LayoutCtrl', function($scope, $http, UserService) {
        $scope.$on( "$locationChangeStart", function(event, next, current) {
            if ( UserService.getUser() === null ) {
        // no logged user, we should be going to #login
                if ( next.templateUrl == "partials/login.html" ) {
          // already going to #login, no redirect needed
                } else {
          // not going to #login, we should redirect now
                $location.path( "/login" );
                }
            }         
        });
    });

Layout.jade：

doctype html
html(ng-app="myApp", ng-controller='LayoutCtrl')
  head
    meta(charset='utf8')
    base(href='/')
    title Angular Express Seed App
    link(rel='stylesheet', href='/css/app.css')
  body
    block body

和 UserService.js：

angular.module('myApp').
    service('UserService', function(){
        var $scope = this;
        var user = null;
        $scope.user = {};

        $scope.setUser = function(data){
                user = data;
        };
        $scope.getUser = function(){
                $scope.user = user;
        };

        return $scope;
  });

Answer 1

我不明白您的服务应该如何工作，您的 getUser 函数不返回任何内容（未定义）。

改用这个：

angular.module('myApp').
    service('UserService', function(){
        var user;

        this.setUser = function(data){
          user = data;
        };
        this.getUser = function(){
          return user;
        };
  });

所以你的问题是 undefiend !== null

你正在检查这个：

 if ( UserService.getUser() === null )

如果您想检查它是否未定义（或其他虚假值），请使用：

 if ( ! UserService.getUser() )

你也应该注入 $location:

 controller('LayoutCtrl', function($scope, UserService, $location) {

调试

• 使用 console.log 检查应用程序的流程
• console.log(UserService.getUser()) # undefined

带有运行块的替代解决方案：

angular.module('myApp').
    run(function($rootScope, UserService, $location) {
        $rootScope.$on( "$locationChangeStart", function(event, next, current) {

        });
    });