0

私がいつも遭遇する問題があり、その結果、コントローラーのスコープ変数の定義と矛盾します。

お気づきかもしれませんが、controllerAs構文を使用すると、以下に示すように、コントローラー関数内のこのインスタンスにすべての変数をアタッチする必要があります。

angular.module('angularJsInternationalizationApp')
  .controller('MainCtrl', function (SampleService) {
    this.awesomeThings = [
      'HTML5 Boilerplate',
      'AngularJS',
      'Karma'
    ];

    this.translatedFromService = '';
    SampleService.getTranslation().then(function(data){
        this.translatedFromService = data;
    });
  });

ここでの問題は、this.translatefDromServiceを、コントローラーではなく新しい関数のインスタンスとして受け取るため、サービスの成功関数またはエラー関数、または実際には他の関数から更新できないことです。

そのようなシナリオで何ができるか。

これをvmにタグ付けする1つのソリューションを使用しました。 var vm = これはコントローラーの先頭にありますが、これ以外に解決策はありますか?

乾杯！

4

1 に答える 1

1

次の 2 つのオプションがあります。

1）コントローラーのコンテキストvm = thisへのリンクを維持しながら、アプローチを使用します。this

angular.module('angularJsInternationalizationApp')
  .controller('MainCtrl', function (SampleService) {
    var vm = this;
    vm.awesomeThings = [
      'HTML5 Boilerplate',
      'AngularJS',
      'Karma'
    ];

    vm.translatedFromService = '';
    SampleService.getTranslation().then(function(data){
        vm.translatedFromService = data;
    });
  });

2)ハンドラーでbind() メソッドを使用します。これにより、呼び出された関数のコンテキストがコントローラーのコンテキストに変更されますthis。

angular.module('angularJsInternationalizationApp')
  .controller('MainCtrl', function (SampleService) {
    this.awesomeThings = [
      'HTML5 Boilerplate',
      'AngularJS',
      'Karma'
    ];

    this.translatedFromService = '';
    SampleService.getTranslation().then(function(data){
        this.translatedFromService = data;
    }.bind(this));
  });
于 2016-02-22T07:24:56.803 に答える