web-dev-qa-db-ja.com

controllerAs構文を使用するときに現在のスコープをmodalInstanceに渡す

私は、controllerAs構文を使用して、コントローラーでの$ scopeスープを回避し、ui.bootstrapを使用してモーダルビューを表示しています。

現在のコントローラーと同じスコープを共有するmodalInstaceを開く必要があります。スコープを注入するとき、おそらく次のようなことをすることができます:

var modalInstance = $uibModal.open({
      templateUrl: 'addEditModal.html',
      scope: $scope
    });

ただし、スコープを挿入しておらず、controllerAs構文を使用しているため、機能しません。

私が見つけたものから、データを渡すにはresolveを使用する必要がありますが、関数を介して明示的に渡す必要があります。スコープ全体を渡す方法はありますか?

そのモーダルでやらなければならないことがたくさんあり、データのロードを渡すのはやり過ぎのようです。

乱雑に見えるので、これを実行したくない...

var modalInstance = $modal.open({
  templateUrl: 'myModalContent.html',
  controller: 'ModalInstanceCtrl',
  resolve: {
    user: function() {
        return vm.user;
    },
    something: function() {
        return vm.something;
    },
    blah: function() {
        return blah;
    }
  }
});

より良いアイデアはありますか?

12
afterxleep

現在のコントローラーと同じスコープを共有するmodalInstaceを開く必要があります。

モーダルサービス 継承されたスコープを作成 。そして

var modalInstance = $uibModal.open({
  templateUrl: 'addEditModal.html',
  scope: $scope
});

スコープを挿入しませんが、モーダルコントローラーの親スコープを指定します(そうでない場合、ルートスコープが親として使用されます)。

ControllerAsは親コントローラーで使用されたため、モーダルコントローラーはそのスコープで継承されたvmオブジェクトにアクセスできます。

15
Estus Flask

私が正しく理解したかどうかはわかりませんが、現在の 'controllerAs'をresolveパラメータに渡して挿入することで機能します

var modalInstance = $uibModal.open({
      templateUrl: 'addEditModal.html',
      controller: 'AudioItemAddEditCtrl as vm',
      resolve: {
        parent: function(){
            return vm
        }
    }
    });

次に、AudioItemAddEditCtrl ...

var AudioItemAddEditCtrl = function(parent, AudioItemService, $ModalInstance) {
...
}

次に、「親」を使用して親コントローラースコープに直接アクセスできます。

これが他の誰かを助けることを願っています。

8
afterxleep