gpt4 book ai didi

angularjs - 将 FireBaseAuthClient 与 AngularJS 结合使用时为 "Error: $apply already in progress"

转载 作者:行者123 更新时间:2023-12-03 00:03:54 24 4
gpt4 key购买 nike

我试图在 AngularJS 范围内记录登录用户,但在页面首次加载时出现错误。

单击“登录”似乎有效,但注销后会出现相同的“$apply 已在进行中”错误。

我想我只是误解了 $apply 的工作原理,有人可以帮忙吗?

更新:

如果我将 if (user) 部分包装在 $apply() 中,如下所示,它可以无缝工作。

var auth = new FirebaseAuthClient(ref, function(error, user) {
if (user) {
$scope.$apply(function(){ $scope.user = user; });
console.log(user);
} else if (error) {
// I can't vouch for this, haven't tested it
$scope.$apply(function(){ $scope.user = null; });
console.log(error);
} else {
$scope.user = null;
console.log("logged out");
}
});

原始代码:

app.js:

var app = angular.module('app', ['firebase']);

Controller .js:

app.controller('Login', ['$scope', 'angularFire',
function($scope, angularFire) {
$scope.loginstatus = 'logged out';

var ref = new Firebase("https://app.firebaseio.com/");
var auth = new FirebaseAuthClient(ref, function(error, user) {
if (user) {
$scope.$apply(function(){ $scope.loginstatus = 'logged in'; });
} else if (error) {
$scope.$apply(function(){ $scope.loginstatus = 'error'; });
alert("Login error: " + error);
} else {
$scope.$apply(function(){ $scope.loginstatus = 'logged out'; });
}
});

$scope.login = function(provider, args) {
auth.login(provider, args);
}

$scope.logout = function() {
auth.logout();
}
}]);

index.html:

<!DOCTYPE html>
<html lang="en" ng-app="app">
<head>
<meta charset="utf-8">
<title>App</title>
<script type="text/javascript" src="https://cdn.firebase.com/v0/firebase.js">
<script type="text/javascript" src='https://cdn.firebase.com/v0/firebase-auth-client.js'></script></script>
<script type="text/javascript" src="lib/angular/angular.js"></script>
<script type="text/javascript" src="lib/angularFire.js"></script>
<script type="text/javascript" src="js/app.js"></script>
<script type="text/javascript" src="js/controllers.js"></script>
</head>
<body ng-controller="Login">
<p>Login status: {{loginstatus}}</p>
<div class="container">
<h1>Login</h1>
<p>
<button ng-hide="user" ng-click="login('twitter')" class="btn btn-primary btn-large">Login</button>
<button ng-show="user" ng-click="logout()" class="btn btn-primary btn-large">Logout</button>
</p>
</div>
</body>
</html>

最佳答案

$apply 仅当您处于 Angular 上下文之外时才需要(例如 setTimeout、setInterval 或非 Angular XHR 回调)。

由于 FireBaseAuthClient 是一个根据 Angular 编写并注入(inject)到 Controller 中的工具,因此回调很可能已经包含在 $scope.$apply 中。您可以通过删除 $scope.$apply 来修复代码,因此只需:

var ref = new Firebase("https://app.firebaseio.com/");
var auth = new FirebaseAuthClient(ref, function(error, user) {
if (user) {
$scope.loginstatus = 'logged in';
} else if (error) {
$scope.loginstatus = 'error';
alert("Login error: " + error);
} else {
$scope.loginstatus = 'logged out';
}
});

关于angularjs - 将 FireBaseAuthClient 与 AngularJS 结合使用时为 "Error: $apply already in progress",我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16452354/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com