Как использовать синтаксис controllerAs с модальным AngularJS в случае подхода "модальный в одном контроллере"

Question

Это моя модальная функция:

vm.openUpdateStateModal = function (nextState, idea) {
  $scope.nextState = nextState;
  $scope.idea = idea;
  $scope.modalWindowOpen = true;

  $scope.modalInstance = $modal.open({
    templateUrl: 'updateStateModal',
    windowClass: 'updateStateModal',
    scope: $scope
  });

  $scope.modalInstance.result.then(function () {
    $scope.updateState(nextState, idea);
  });

  $scope.modalInstance.result.finally(function () {
    $scope.modalWindowOpen = false;
  });
};

Я не хочу иметь другой контроллер для моего модального режима, поэтому я просто даю свой $scope в качестве параметра, а не отображаю параметры отдельно. Так что со стороны представления я могу использовать все переменные $scope.

Вчера я обновил свой контроллер до контроллера, как синтаксис:

angular.module('app')
  .controller('IdeaCtrl', function ($scope, ...) {

    var vm = this;
    ...

Теперь, как я могу адаптировать эту модальную функцию к этому новому синтаксису? Задача для меня заключается в следующем: я повторно использую вид модального окна, также на моем основном виде (без модального). И это представление уже адаптировано к новому синтаксису "vm.data" вместо "data".

Я пытался дать мой VM как объем, он не работал. Как я могу справиться с этим?

РЕДАКТИРОВАТЬ:

Я изменил свою функцию на это:

vm.openUpdateStateModal = function (nextState, idea) {
  $scope.nextState = nextState;
  $scope.idea = idea;
  $scope.modalWindowOpen = true;

  $scope.modalInstance = $modal.open({
    templateUrl: 'updateStateModal',
    windowClass: 'updateStateModal',
    controller: 'IdeaCtrl as vm',
    scope: $scope
  });

  $scope.modalInstance.result.then(function () {
    $scope.updateState(nextState, idea);
  });

  $scope.modalInstance.result.finally(function () {
    $scope.modalWindowOpen = false;
  });
};

Поэтому я добавил эту строку:

controller: 'IdeaCtrl as vm',

Теперь это выглядит нормально. Но я все еще должен использовать идею и переменные nextstate из области видимости. Как я могу использовать также те из VM?

Answer 1

Хорошо, я сделал это так:

vm.openUpdateStateModal = function (nextState, idea) {
  vm.modalWindowOpen = true;
  vm.nextState = nextState;
  $scope.idea = idea;

  vm.modalInstance = $modal.open({
    templateUrl: 'updateStateModal',
    windowClass: 'updateStateModal',
    scope: $scope
  });

  vm.modalInstance.result.then(function () {
    vm.updateState(nextState, idea);
  });

  vm.modalInstance.result.finally(function () {
    vm.modalWindowOpen = false;
  });
};

Что касается представления, я использую идею из области видимости, а другие переменные из VM. Я должен использовать идею непосредственно из области видимости, так как у меня есть вот что на моем главном экране:

ng-repeat="idea in vm.awesomeIdeas

..и я не могу определить что-то вроде этого:

ng-repeat="vm.idea in vm.awesomeIdeas

Answer 2

Если вы используете принятые модальные представления для использования vm в качестве префикса для ссылки на контроллер, область, которую вы передаете модальному шаблону, должна иметь vm имущество. Тогда все, что вам нужно сделать, это убедиться, что вы установили это vm имущество:

$scope.vm = this;

$scope.openUpdateStateModal = function(nextState, idea) {
    $scope.nextState = nextState;
    $scope.idea = idea;
    $scope.modalWindowOpen = true;

    $scope.modalInstance = $modal.open({
        templateUrl: 'updateStateModal',
        windowClass: 'updateStateModal',
        scope: $scope
    });

    $scope.modalInstance.result.then(function() {
        $scope.updateState(nextState, idea);
    });

    $scope.modalInstance.result.finally(function() {
        $scope.modalWindowOpen = false;
    });
};

Так что, если вы знаете, что собираетесь открыть модал, который использует vm в качестве контроллера как префикс, то просто укажите это vm как $scope.vm = this; в этом объеме.