Question

我正在使用角度ui模态在我的项目中创建模态。

一切正常，直到我需要在父范围内引用变量。见plunker code

似乎模态无法访问父作用域。无论如何要克服这个问题吗？

Answer 1

Angular UI的模式默认使用$rootScope (See the documentation here)。

您可以在打开模式时传递带有自定义范围的scope参数 - 例如如果要传递父作用域，请scope: $scope。模态控制器将从该范围创建子范围，因此您只能将其用作初始值。

Answer 2

您需要在$ modal选项中引用父作用域。 Angular documentation

Corrected Plunker Version

下面是我添加的内容的代码片段。

var modalInstance = $modal.open({
  templateUrl: 'myModalContent.html',
  controller: ModalInstanceCtrl,
  scope:$scope, //Refer to parent scope here
  resolve: {
    items: function () {
      return $scope.items;
    }
  }
});

Answer 3

您可以向父div添加ID并使用他的范围。

<div id="outerdiv"  ng-controller="OuterCtrl">
<h2>Outer Controller</h2>
<input type="text" ng-model="checkBind">
<p>Value Of checkbind: {{checkBind}}</p>

在控制器中设置“假”绑定

//init
$scope.checkBind = angular.element(document.getElementById('outerdiv')).scope().checkBind;

  $scope.$watch('checkBind', function (newValue, oldValue) {
//update parent
  angular.element(document.getElementById('outerdiv')).scope().checkBind = $scope.checkBind;
  });

请参阅http://plnkr.co/edit/u6DuoHJmOctFLFhvqCME?p=preview

angular ui modal不能引用父范围

3 个答案: