【问题标题】:How to pass a function to angular ui bootstrap modal如何将函数传递给 angular ui bootstrap modal
【发布时间】:2015-12-25 06:02:24
【问题描述】:

将函数传递给角度 ui 引导模式对话框的最佳方法是什么?我在模态控制器中创建了一个调用 $scope.$parent.myMethod() 的方法,如下所示:

$scope.isChosen = function(concept) {
    return $scope.$parent.isChosen(concept);
};

这可行,但我宁愿将函数传递给模态,就像函数传递给指令的方式一样。我尝试使用模态“resolve”参数来执行此操作,但没有成功。是否可以为模态解析函数,如果可以,语法是什么?如果不可能,除了访问父范围之外,还有其他方法吗?

编辑:这是一个尝试将方法传递给模式的 plunk,它有点简化,但代表了我正在尝试做的事情:http://plnkr.co/edit/eCjbZP

【问题讨论】:

  • resolve 属性当然是可能的,如果你用你迄今为止尝试过的东西准备一个最小的 plunker,我可以展示代码。话虽如此,您的用例听起来有点奇怪。从功能上讲,你想做什么?
  • 我需要根据主控制器中的其他变量过滤模态中的项目。我只需要传递一个返回 true 或 false 的 1 个参数的函数。
  • 在这种情况下传递过滤参数不是更好吗?这种方式或其他方式会立即为您提供答案
  • 过滤方法比较复杂,用的地方比较多。我宁愿将它集中在我的主控制器中。我已经用@xe4me 的解决方案做了一个小技巧,但它还没有为我工作。

标签: angularjs angular-ui-bootstrap


【解决方案1】:

当你定义你的模态时,你必须像这样解决:

  // here is the controller where you want to trigger the modal to open
 $scope.openModal = function () {
     // somewhere in your html , you may click on a button to envoke openModal()
   var modalInstance = $modal.open({
      templateUrl: 'myModalContent.html',
      controller: ModalInstanceCtrl,
      size: size,
      resolve: {
        isChosen: function () {
          return $scope.isChosen;
        }
     }
   });
};

稍后,在您的 modalCtr 中,您可以像这样注入 isChosen

  app.controller('modalCtrl',function($scope,isChosen){
     // now you can use your isChosen function however you want
  });

【讨论】:

  • 我想我现在可以通过将解析更改为 isChosen: function () { return $scope.isChosen; }
  • 是的,这就是解决方法,如果您更新答案,我会接受。这是一个更新的 plunk,包含正确的代码并进行了一些清理:plnkr.co/edit/tHCN4j
  • 是的,你是对的,我在回答你的问题时有点着急:P
猜你喜欢
  • 2018-03-30
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2015-10-17
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多