使用 controllerAs 语法时将当前范围传递给 modalInstance

Posted 2023-02-22

【中文标题】使用 controllerAs 语法时将当前范围传递给 modalInstance

【英文标题】：Pass current scope to modalInstance when using controllerAs syntax

【发布时间】：2016-01-14 20:10:41

【问题描述】：

我正在使用 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;
    
  
);

有更好的想法吗？

【参考方案1】：

我需要打开一个 modalInstace，它与 电流控制器。

模态服务creates inherited scope。和

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

不注入作用域，但指定模态控制器的父作用域（否则根作用域将用作父作用域）。

由于在父控制器上使用了 controllerAs，模态控制器将可以访问其范围内继承的 vm 对象。

【讨论】：

此解决方案需要将 $scope 注入控制器。这是我们尽量避免的。

@Bendim 正如答案中所说，它不会注入范围，而是指定模态控制器的父范围。在某些服务中，它可以是控制器的$scope 或scope = $rootScope.$new() 范围。 $uibModal 就是这样设计的。 “我们”是谁？如果您有类似的问题，请随时发布反映您的特定情况的问题。

这似乎是答案的一半。然后你必须将 $scope 注入你的模态控制器，然后你可以访问父范围变量作为 $scope.controllerasname.variable

@nuander 答案直接解决了这个问题，并不是一个循序渐进的教程。这是直接级别的主题，我假设读者已经意识到应该将 $scope 注入控制器以便使用。但是感谢您的有用评论，希望这可以帮助某人。

我认为值得一提，因为使用控制器作为语法，您不必总是注入 $scope

【参考方案2】：

不确定我是否理解正确，但我通过在解析参数中传递/注入当前的“controllerAs”使其工作

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

然后，在 AudioItemAddEditCtrl...

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

然后我可以使用'parent'直接访问父控制器范围。

希望这对其他人有所帮助。