Question

我正在使用angular-bootstrap $ modal，我有问题了解如何在控制器和模态之间共享数据。

控制器：

app.controller 'MainController', ($scope, $templateCache) ->      
  $scope.openModal = ->
    modal = $modal.open(
      template: $templateCache.get('modal.html')
      controller: modalController
      size: 'sm'
      resolve:
        repository: ->
          $scope.repository
    )

模态：

modalController = ($scope, $modalInstance, repository) ->
  $scope.repository = repository

  $scope.update = (other_repo) ->
    $scope.repository = other_repo  
    $modalInstance.dismiss('cancel')

此时我希望MainController中的$scope.repository在从模态更改时更新，但事实并非如此。

我错过了什么？

谢谢

Answer 1

模态控制器的范围与打开模态的控制器不同。要在对话框关闭后从对话框中获取一些数据，您应该从结果承诺中获取数据，如the documentation中的示例所示：

modal = $modal.open(...);

modal.result.then(function (otherRepo) {
  $scope.repository = otherRepo;
}

Answer 2

如果你没有将控制器的范围传递给$ modal，它会创建一个新的，原型继承自$ rootScope：var modalScope = (modalOptions.scope || $rootScope).$new();并且没有连接到开启者的控制器范围。但你可以进入打开它的控制器的模态范围：

  $scope.open = function (size) {
    var modalInstance = $modal.open({
      templateUrl: 'myModalContent.html',
      controller: ModalInstanceCtrl,
      size: size,
      scope: $scope
    });

这次，ModalInstanceCtrl中的范围将继承父控制器的范围，所有更改都将反映在开启控制器的范围内。

Look at this plunker (it's slightly changed sample from Bootstrap-UI) 来自开场作用域的selected对象在模态中更新，此更新立即反映在ModalDemoCtrl控制器的视图中。

在控制器和angular-bootstrap $ modal之间共享数据

2 个答案: