AngularJS 个子模块（和身份验证）

Question

免责声明：这是 Angular 中的一个持续 "first project"，所以我还在磨牙。

长话短说，我正在使用 the answer here as a pattern for authentication (done via RESTful calls to a PHP script). It works just fine. The caveat comes in when I want it to work with an already existing controller on the Angular side of things. Coming from my C++/Perl/Python background, I want to write it once and include it. For that, I found the answer here。虽然它并不完全适合我。对于初学者来说，我的网站是从另一个网站模板化而来的，语法有点不同——我还不太明白这一点。当我在 myApp 中尝试 InjectedModule.otherApp 时，出现错误。代码看起来像这样：

angular.module('otherApp', ['ngRoute','infinite-scroll'])
.controller("loginController",
            ['$scope',
            '$http',
            '$location',
            '$window',
            function($scope,$http,$location,$window) {
// Do a bunch of authentication stuff

}])

angular.module('myApp', ['ngRoute','infinite-scroll'])
.controller("imageController",
        ['$scope',
        '$http',
        '$location',
        '$window',
        function($scope,$http,$location,$window) {

// Guts of the page generated here

}])

理想情况下，我希望 imageController 依赖于身份验证控制器，并且当然可以控制基于身份验证显示的内容。

Answer 1

不应依赖控制器。您应该为此使用服务。首先，您应该构建一个身份验证服务。

angular.module('authentication')
.service('authService', function(){
    var isAuthenticated = false;
    var user     = 'guest';
    var username = '';

    return {
      login: function() { isAuthenticated = true; },
      isAuthenticated: function() { return isAuthenticated; },
      loggedInUser: function() { return user; }
    }
});

现在，您的控制器可以从该服务调用身份验证逻辑：

angular.module('authentication', ['ngRoute','infinite-scroll'])
.controller("loginController",
        ['$scope', '$http', '$location', '$window', 'authService',
        function($scope,$http,$location,$window, authService) {

  // Do a bunch of authentication stuff
  $scope.login = function LoginUser() {
    authService.login();
  }

}]);

// include 'authentication' module - 'images' module will depend on it
angular.module('images', ['ngRoute','infinite-scroll', 'authentication'])
.controller("imageController",
    ['$scope', '$http', '$location', '$window', 'authService',
    function($scope,$http,$location,$window, authService) {

  // Guts of the page generated here
  $scope.loadImages = function LoadImages() {
    if (authService.isAuthenticated()) {
      // do authenticated user image load logic
    } else {
      // do unauthenticated user image load logic
    }
  }
}]);

您的应用还应包括以下两个模块：

angular.module('bootstraper', [
  'authentication',
  'images'
])

AngularJS 个子模块（和身份验证）

AngularJS sub-modules (and authentication)

authentication

dependency-injection

angularjs