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

Question

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

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

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

这是我的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" );
                }
            }         
        });
    });

布局.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() )

你还应该注入(inject) $location:

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

调试

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

带有运行 block 的替代解决方案:

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

        });
    });