我有一个管理应用程序身份验证的角度服务。和一个控制器。
$rootScope当用户登录和注销时，服务会触发偶数。
我想更新 UI 中的 DOM 元素，因此它会根据用户状态显示“登录”或“注销”。
请注意，我的 Angular 知识，尤其是在事件方面的知识不是很好，所以请随时给我关于最佳实践的建议。
这是我当前的代码。
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其中导致错误说应用已经在进行中。
如何从事件更新 UI？有没有更好/更标准的方法来实现同样的目标？
提前致谢