7
ログインしたユーザーをAngularJSスコープで記録しようとしていますが、ページが最初に読み込まれたときにエラーが発生します。
「ログイン」をクリックしても動作しているようですが、同じ「$ apply already in progress」エラーでログアウトします。
$apply
の仕組みが誤解されていると思いますが、誰でも助けてくれますか?
更新:
次のように私は$apply()
にちょうどif (user)
一部を包む場合、それはシームレスに動作します。
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>
乾杯が、それは動作しません:あなたはこれだけ、
$scope.$apply
を削除することによって、あなたのコードを修正することができます。それは私が最初からやっていたことです。コールバックは私がそこに押し込むとコンソール出力を見ることができるので動作しますが、 '$ scope'は更新されません。これは、 "角張った"ものではないという症状です。なぜ、私が '$ apply()'を手始めに始めたのですか? –「ログイン」ロジックだけをラップし、上記のようにログアウトロジックを残しておくと機能します。更新についての私の元の質問を参照してください。 –
言われているように、あなたは ''約束事 ''に$ applyを使う必要があります。ちょうどFYI。 –