0

ui-routerについて$scope、ご利用にあたっては、this

controllerAs構文を使用している場合、つまり:

.config(['$stateProvider', function($stateProvider) {
    $stateProvider
        .state('app.login', {
            url: '/login',                  
            templateUrl: 'modules/login/login.html',
            controllerAs: 'login',
            controller: 'LoginCtrl',
            data: {
                authorizedRoles: [USER_ROLES.all]
            }
        });
}])

私のコントローラーでは、thisの代わりに使用してい$scopeます。したがって、ログインコントローラーには次のようなコードがあります。

this.func1 = func1;
this.func2 = func2;
this.message = "Hello world!";

しかし、$scopeからグローバルにブロードキャストされたイベントをリッスンするためにも使用しています。$rootScopeこれは、記憶が正しければ、交換されているにもかかわらず、 にthis属するメソッドがないためです。$scope

$scope.$on('event', handler);

したがって、このイベントがブロードキャストされたときに、イベントブロードキャストをリッスンし$rootScope、 のような他のコントローラーロジックを呼び出しています。func2

$scope.$on('auth-login-failed', function(event) {
// call some other function in controller
});

ハンドラーfunc2内で呼び出したい場合はどうすればよいですか? $onコントローラーでこのようなものを初期化する規則を行う必要がありますか?

var that = this;

$scope.$on('auth-login-failed', function(event) {
    this.func2();
});

進行する最善の方法と、一般的な慣習がここにあることに興味があります。$scopeと の両方を使用するのは適切thisですか? 交換できるため、両者の主な違いは何ですか?

4

1 に答える 1

0

あなたの提案も、いくつかの変数に論理コンテキストを保持してください - 本当に良い、そして良い習慣です:

var _this = this;

$scope.$on('auth-login-failed', function(event) {
    _this.func2();
});

Typescript実際、それは私たちの舞台裏で、How が同じことをしている方法です。いわゆる

アロー機能

タイプスクリプトでは次のようになります。

$scope.$on('auth-login-failed', (event) => {
    this.func2();
});

バックグラウンドで Typescript コンパイラが上記のトリックを実行し、論理スコープがいくつかの変数に保持されるためです。

私はあなたに提案します：

... Typescript の使用を開始するために最善を尽くします。とにかく角度のある世界の未来です...

実際の例controllerをTypescript含む、角度を作成する方法の詳細へのリンクがいくつかあります

于 2015-10-25T15:04:54.903 に答える