1

我的应用程序中有一个导航栏，用于控制整个应用程序的路由。因此，导航栏位于 index.html 文件中。

问题是在加载页面时加载了导航栏 NavController。在那个 NavController 中，我得到了用户的登录信息。用户信息用于确定显示哪些导航控件，因此是 showHomeNav、showAdminNav。问题是运行 NavController 时用户通常没有登录，因此没有显示任何内容（这是正确的）。但是当用户登录时，我需要让导航栏 html 识别并显示正确的选项卡。

就目前而言，我不确定如何设置“显示”变量。我需要做的是更改 LoginController 中这些变量的状态，因为它是处理登录路由的控制器，登录后您将看到基于用户访问权限的选项卡。

我想我可以只检查 NavBar HTML 中的 $rootScope 变量 ($rootScope.user)，然后在 LoginController 中设置 $rootScope.user。但我不确定这是正确的方法。

这是一个关于它的立场的例子。请注意，在我登录（模拟）后，主页和管理选项卡不会显示。

http://plnkr.co/edit/zkqeAW?p=preview

4

2 回答 2

3

两个想法：

首先，您可以创建自己的“根”控制器。您只需要在登录控制器上方（分层地）添加一个控制器。<html>将它添加到标签或任何标签上甚至可能是有意义的ng-app。嵌套控制器没有任何问题。

但是，我认为您的正确答案是使用服务来管理登录信息。这使您可以在控制器之间干净地共享信息，而无需到处乱搞。

一个粗略的例子：

var app = angular.module("myApp", []);

app.factory("LoginService", ["$location", "$timeout", function($location, $timeout) {
    var user = {};
    return {
        getUser: function() { return user; },
        login: function(userName, password) {
            $timeout(function() {
                user.role = 'ADMIN';
                $location.path("/about");
            }, 1000);
        }
    };
}]);

app.controller("SigninCtrl", ["$scope", "LoginService", function($scope, LoginService) {
  $scope.signin = function() {
      LoginService.login("foo", "abc123");
  }
}]);

app.controller('NavCtrl', ['$scope', '$location', 'LoginService', function ($scope, $location, LoginService) {
  $scope.user = LoginService.getUser();
  ...
}]);

我在这里更新了你的 Plunker 代码示例。我还必须修改Nav 控制器showHomeNav上showAdminNav的功能，以便它们会根据用户是否登录而动态更改。

您可能需要稍微调整一下，但您会了解user对象如何在服务中存在的想法。

于 2013-07-30T03:37:02.080 回答
0

您可以尝试使用$rootScope.$broadcast可以跨控制器中继事件的方法。它也使控制器保持解耦。

这是为此更新的 plunkr。

于 2013-07-30T03:51:48.430 回答