Javascript 在出现“的情况下，如何将controllerAs语法与AngularJS模态结合使用；“同一控制器中的模态”；方法

这是我的模态函数：

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变量

昨天，我将控制器更新为controllerAs语法，如下所示：

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

    var vm = this;
    ...

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;
  });
};

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

现在我如何使这个模态函数适应这个新语法？我面临的挑战是：我多次重用模态窗口的视图，也在我的主视图上（没有模态）。这个视图已经适应了新语法“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',

---

现在看来还可以。但我仍然必须使用范围中的idea和nextstate变量。如何也使用来自vm的视图？

如果使用采用的模式视图将

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

作为controllerAs前缀的模式，那么只需将此

vm

作为

$scope.vm=this提供在此范围内。
好的，我这样做：

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

    var vm = this;
    ...

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;
  });
};

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

在视图方面，我使用了scope中的思想，以及vm中的其他变量。我必须直接从范围使用idea，因为我的主要观点是这样的：

ng-repeat="idea in vm.awesomeIdeas

…我无法定义这样的东西：

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

    var vm = this;
    ...

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;
  });
};

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

我认为这不完全相同，因为我不想对modalit使用单独的ctrl键，因为它不起作用。。对我来说这听起来也有点奇怪，我已经将“this”分配给“var vm”。。然后在作用域中创建另一个vm并再次分配“this”。