Question

我在$rootScope中运行了一些内容，为userLoggedIn设置应用程序范围的值：

mod.run(function($rootScope) {
    $rootScope.userLoggedIn = false;

    $rootScope.$on('loggedIn', function(event, args) {
        $rootScope.userLoggedIn = true;
    });
});

当用户登录时，我利用$emit来举起该事件：

mod.controller('FacebookController', function($scope) {
    $scope.loggedIn = function() {
        $scope.$emit('loggedIn');
    };
});

这是有效的。

接下来，我已配置了一个属性指令，以便将$rootScope置于视图中：

mod.directive('rootScope', function() {
    return {
        scope: { userLoggedIn: '@' },
        restrict: 'A'
    };
})

然而，当我在元素上使用它来显示/隐藏它的值时，它不起作用：

<div class="row" root-scope>
    <div class="panel callout radius" ng-show="!userLoggedIn">

和

<form name="listForm" root-scope
    novalidate ng-submit="listForm.$valid && model.save()"
    ng-show="userLoggedIn">

为什么这个价值没有进入范围？当我查看Chrome中的角度范围时，变量不在范围内。它虽然如预期的那样在$parent上。

更新

因此，如果我使用$root.userLoggedIn，它会按预期引用该属性，但是，当值更改时，视图仍然没有响应。例如，如果我最初重新加载页面false，但在Facebook完成登录后，将其设置为true;该观点没有回应。

Answer 1

答案简单得令人难以置信，也充分利用了评论。我确实只需要使用$root.userLoggedIn视图，但我还需要利用$apply：

mod.run(function($rootScope) {
    $rootScope.userLoggedIn = false;

    $rootScope.$on('loggedIn', function(event, args) {
        $rootScope.$apply(function() {
            $rootScope.userLoggedIn = true;
        });
    });
});

Answer 2

scope: { userLoggedIn: '@' }

您的指令需要HTML属性userLoggedIn，但HTML中没有。另请注意，@始终会解析为String。

第二个也是更重要的一点是，只有你的root-scope指令在隔离范围内运行，而不是ng-show。换句话说：使用root-scope无效。仅基于您提供的代码，您的示例按预期工作。

在$ parent变量上显示ngShow？

2 个答案: