Javascript 事件的角度更新范围

我有一个angular服务，负责管理应用程序的身份验证。和一个控制器

当用户登录和注销时，服务在

$rootScope

上激发偶数

我想在我的UI中更新DOM元素，因此它根据用户状态显示“登录”或“注销”

请注意，我的角度知识，特别是在活动方面不是很好，所以请随时给我提供最佳实践的建议

这是我目前的密码

app.service('AuthenticationService', function ($rootScope) {

var _loggedIn = "false";

this.login = function (email, password) {

    if (!email || !password) return 1;
    else {
        _loggedIn = "true";
        // broadcast on root scope, so anyone can listen
        $rootScope.$broadcast("loginChanged", 1);
        return 0;
    }
};

this.logout = function (email, password) {
    _loggedIn = "false";
    // broadcast on root scope, so anyone can listen        
    $rootScope.$broadcast("loginChanged", 0);

} 
/*other functions ommited*/
});

在我的控制器里

var addListener = function () {
    listener = $scope.$on("loginChanged", function (e, loggedIn) {
        $scope.loginButton.text = loggedIn ? "Log Out" : "Log In";
        $scope.loginButton.link =  loggedIn ? "#/logout" : "#/login";

        console.log("loginChanged: " + loggedIn);
    }); // $on returns a registration function for the listener
};

问题是，

console.log（…）

工作正常，尽管$scope更新没有反映在UI中。我尝试将其包装在

$scope.$apply

中，这导致出现一个错误，称apply已在进行中

如何从事件更新UI？是否有更好/更标准的方法来实现同样的目标

---

提前感谢

您的代码运行良好。这是一个扑克牌：

但我不会使用$brodcast来通知ui更改。这就像用全局变量来争论您的全局名称空间。我建议传入一个服务，并监听该服务的更改。我创建了一个plunker，向您展示我的意思：

---

提供复制问题的演示。听起来可能有一些嵌套导致了范围继承问题。没有标记很难帮助。如果日志正在工作…问题是其他方面，请说明如何将

登录按钮

变量集成到HTMLOGIN按钮中，因为这

使

\loggedIn

与

$broadcast

中使用的数据参数

loggedIn

混淆，这似乎是数字。您是对的。重构源代码，不使用$broadcast，然后回想错误是什么，它不起作用，这让我感到困惑。将更新我的答案。Tyless开销使用$broadcast比$watch你说开销少是什么意思？这取决于你想做什么。查查这篇博文，查理特认为$watch比$broadcast更贵，这是对的。但只要你看的是简单的原始版本，我就不会太担心性能。