Angular ui modal не может ссылаться на родительскую область

Я использую angular ui modal для создания модального в моем проекте.

Все работает нормально, пока мне не понадобится ссылаться на переменную в родительской области. см. код плунжера

Похоже, модальный не может получить доступ к родительской области. Есть ли способ преодолеть это?

Ответ 1

Angular Модификаторы пользовательского интерфейса используют $rootScope по умолчанию (см. документацию здесь).

Вы можете передать параметр scope с настраиваемой областью при открытии модального файла. scope: $scope, если вы хотите передать родительскую область. Модальный контроллер создаст подпункт из этой области, поэтому вы сможете использовать его только для своих начальных значений.

Ответ 2

Вам нужно будет обратиться к родительской области в ваших опциях $modal. Angular документация

Исправленная версия Plunker

Ниже приведен фрагмент кода того, что я добавил, чтобы он работал.

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

Ответ 3

Вы можете добавить идентификатор родительского div и использовать его область действия.

<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