Question

假设我有一个名为is_logged_in的变量标志，我希望它在所有控制器的范围内。因此，如果我的应用中的每个页面都有{{is_logged_in}}，它就会将其打印出来。

如何在所有控制器中实现而不是像这样重复代码：

function MyCtrl($scope, IsLoggedInService) {
$scope.is_logged_in = IsLoggedInService.IsLoggedIn();
}

Answer 1

更改为：

$rootScope.is_logged_in = IsLoggedInService.IsLoggedIn();

Answer 2

您最好的选择是使用$rootScope。顾名思义，这对应于应用程序的根范围，因此可以在任何控制器中使用（通过DI）。您需要做的就是在需要它的每个控制器中添加$rootScope作为DI依赖项：

function MyCtrl($scope, $rootScope {
  $rootScope...
}

在您的模板中，$rootScope始终可通过在角度表达式中引用$root来使用。

你会做这样的事情：

<p>{{$root.is_logged_in}}</p>

Answer 3

如果要检查用户是否已登录我认为解决问题的正确方法是在路线中使用resolve属性，因此如果用户没有登录，用户就无法导航到某些页面，一旦登录，您可以将用户对象注入控制器

例如，要导航到您必须登录的主页

.when("/home", {
templateUrl: "homeView.html",
controller: "homeController",
resolve: {
    user: function(AuthenticationService){
        return AuthenticationService.getUser();
    }
  }
})

app.controller("homeController", function ($scope, user) {
  $scope.user = user;
});

https://www.sitepoint.com/implementing-authentication-angular-applications/

如果您只想要一个全局变量，可以使用$ rootScope

Answer 4

另一种使用$ rootScope的方法是使用 $ broadcast 为该变量创建一个观察者。

为此，您应该在更改此变量时广播事件，如下所示：

$rootScope.$broadcast('user_logged_in');

然后，使用$ on方法观察它。这里：

$scope.$on('user_logged_in', function(event, args) {
    // here you do what you want, like:
    $scope.logged_in = true;
});

如果您想了解更多信息，angular还提供了$ emmit方法，当您希望在您的范围之外的范围听取该事件时使用该方法。（您可以在此处找到更多信息：$rootScope.$broadcast vs. $scope.$emit

但是，您应该在文档，What are scopes?和此处了解更多信息：$rootScope.Scope

如何在所有控制器中的$ scope中放置一个变量

4 个答案: