3

私のAngularアプリに$scopeはuser、name.

クリック時にこの変数を「テスト」に設定した場合：

<a href="#" ng-click="setUser()">Set User</a>

関数で

$scope.user = {
  name: 'blank'
}

$scope.setUser = function(name) {
  $scope.user.name = name
}

これはうまくいきます。ただし、これをpromise.then()* 内に設定すると、変数が正しく設定されているように見えますが、$scope.user で別のアクションを実行するまで、Angular はビューで変数を更新しません。

<a href="#" ng-click="startLogin()">Set User</a>

今、新しい関数を呼び出し、startLogin()

$scope.user = {
  name: 'blank';
};

$scope.setUser = function(name) {
  $scope.user.name = name;
};

$scope.startLogin = function() {
  var promise = Kinvey.ping();
  promise.then(function(response) {
    console.log('success');
    $scope.setUser('test');
  });
};

こうやってから。ビューの{{user.name}}フィールドはまだ「空白」です。また、次のこともテストしました。

  • $scopeコンソールにログを記録すると、機能は正常に機能しています。
  • また、ログ$scope.userが正しく返され、変数が変更されたことが示されます。
  • 興味深いことに、2 回目のクリックで最終的にビューが変わります。
  • を追加することでこれを解決することもできますが$scope.$apply()、これを修正する方法が間違っているようです。

* CommonJS の promise.then()と同様または同一の構文を使用するKinveyを使用しています。

4

1 に答える 1

5

角度ダイジェスト サイクル中に双方向バインディングが更新されます。これらのサイクルは、ディレクティブにバインドされた DOM イベント、または Angular エコシステムに参加している他のエンティティによってトリガーされます。

したがって、Angular が提供する「魔法」は、そのダイジェスト サイクルの自動トリガーにすぎません。次のコマンドでダイジェスト サイクルをトリガーできます$scope.apply。

promise.then(function(response) {
  $scope.$apply(function() {
     console.log('success');
     $scope.setUser('test');
  });
});

これは、サードパーティのライブラリを扱う場合に推奨されるアプローチです。

于 2013-10-02T16:07:14.280 に答える