4

AngularJS 1.5 より前のディレクティブまたはビューでは、変更がサード パーティの非同期コールバックから発行されたときに ($digest サイクルを使用して) angular によって変更が確実に取得されるようにする方法は、$scope.$apply()呼び出しでコードを実行することでした。

私が理解している限り、コンポーネントでは$scope、テンプレートを取り除き、コンポーネントのコントローラーにバインドするだけです。$scope に依存せずに、ビューの代わりにコンポーネントの記述に移行しようとしています。次のコードがあるとします。

function CompController(TPApi) {
    let self = this;
    this.endCallback = false;
    TPApi.call(data, () => this.endCallback = true );
}

angular.module('app',  []).component('myComp', {
    controller: CompController,
    template: '<div><span ng-show="$ctrl.endCallback">Callback Called</span></div>'
})

ここでの問題はng-show、コントローラーに二重にバインドされていることですが、コールバックに $scope.$apply() を使用しないと、$digest サイクルがトリガーされないため、変更が ng-show によって取得されません。コントローラーに $scope を挿入して $apply を呼び出す必要があるため、これは非常に面倒ですが、そもそも $scope に依存する目的が無効になります。

TPApi を$qサービスでカプセル化して、コールバックが発行されたときに $digest サイクルが確実に呼び出されるようにする方法があると思います。Promiseしかし、ある時点で、代わりに新しいネイティブ API を使用するように移行したい場合はどうすればよい$qでしょうか?

$digest をトリガーせずにこれを行うスマートな方法はありますか、または $scope と $digest のために角度 1 に本質的な欠陥がありますか?

4

1 に答える 1

0

サードパーティの API を呼び出しているため、Angular を更新して新しいデータが到着したことを認識させる必要があります。$scope を使用したくない場合は、コードを $timeout でラップできます (これにより、ダイジェスト サイクルがトリガーされます)。

function CompController(TPApi) {
    let self = this;
    this.endCallback = false;
    TPApi.call(data, () => $timeout(() => this.endCallback = true, 0));
}
于 2017-01-09T18:21:29.000 に答える