如何在不关闭的情况下将 angular-ui-bootstrap 模态的结果传递给父级？

Question

根据 https://angular-ui.github.io/bootstrap/#/modal，我想在不关闭的情况下将结果从模态传递给父级，但在示例代码中，它们仅通过关闭向父级显示传递结果

$uibModalInstance.close($scope.selected.item);

我想在单击项目时将数据传递给父项，但我不知道该怎么做。我真的需要帮助。谢谢。

Answer 1

这是控制器之间通信的一个很常见的问题，因为您不想关闭模型并想将数据传递给不同的控制器。

解决问题的最快途径是使用 $broadcast。在模态的控制器中，这样写：

// Make sure to use $rootScope
$rootScope.$broadcast("modalDataEventFoo", {selectedItem: $scope.selected.item});

现在，在你的父控制器中：

$scope.$on("modalDataEventFoo", function(event, data) {
     console.log("got the data from modal", data.selectedItem);
});

控制器之间通信的其他参考资料：

What's the correct way to communicate between controllers in AngularJS?
https://egghead.io/lessons/angularjs-sharing-data-between-controllers
http://www.angulartutorial.net/2014/03/communicate-with-controllers-in-angular.html
Communication between controllers in Angular

Answer 2

另一种方法是在父控制器和模态控制器之间共享作用域，在选项中声明scope 属性：

var modalInstance = $uibModal.open({
  animation: $scope.animationsEnabled,
  templateUrl: 'myModalContent.html',
  controller: 'ModalInstanceCtrl',
  size: size,
  scope: $scope,
  resolve: {
    items: function () {
      return $scope.items;
    }
  }
});

检查这个 plunker，其中模态包含一个绑定到变量 $scope.shared.name 的输入元素： http://plnkr.co/edit/4xiEXATxAnvDKBSXxzQd

如何在不关闭的情况下将 angular-ui-bootstrap 模态的结果传递给父级？

How to pass a result from modal of angular-ui-bootstrap to parent without closing?

angularjs

angular-ui-bootstrap