Доступ к области доступа

Я установил общую директиву диалога с заголовком и кнопками apply/cancel. Диалог имеет изолированную область.

Содержимое директивы диалога завершается, и поэтому его область видимости - это совокупность области диалога:

Из Angular js docs:

Однако изолированная область создает новую проблему: если преобразованная DOM является дочерним элементом изолированной области виджета, то она не сможет привязываться ни к чему. По этой причине transcluded scope является дочерним элементом исходной области, прежде чем виджет создаст изолированную область для своих локальных переменных. Это делает исключенных и виджетов отдельными сущностями сферы видимости.

Это создает для меня новую проблему. TransCluded DOM должен иметь возможность отвечать на диалог при его применении. Поэтому я хотел бы настроить свойство "apply" в диалоговом окне, и пусть это закроет DOM. Это невозможно, потому что они братья и сестры!

Где я иду не так?

3 ответа

Оке, я думаю, что нашел решение. Я завернул фактический диалог в директиве, которая определяет область действия над диалогом. Содержимое диалогового окна все еще транслируется в диалоговом окне, но так как оно примет его родительскую область с parent of the dialog (!!), а не само диалоговое окно (это работает так), это будет очень хорошо.

Кроме того, я могу заставить директиву sg-import ответить, когда диалог применяется с помощью &property в диалоговом окне. Когда диалог применяется, я оцениваю функцию sg-apply в контексте родительской области (обследование выполняется автоматически, мне просто нужно вызвать метод из функции apply() контроллера).

<div sg-import="">
 <div sg-dialog="" title="Import Photographs" visible="show_import_dialog" sg-apply="upload()">
 <div>
 <div sg-photo="" title="{{ file.name }}">
 </div>
 
 </div>
 </div>
</div>


Я столкнулся с чем-то подобным, и есть два способа (которые я знаю) для прямого доступа к транскодируемой области.

Во-первых, создайте область действия внутри функции компиляции, а затем передайте ее функции связывания перекрещивания вместе с функцией связывания клонов:

function compileFn(tElement, tAttrs, transclude) {
 return linkFn;
 function linkFn(scope, element, attrs) {
 scope = scope.$new();
 scope.name = attrs.works1;
 transclude(scope, function(clone) {
 element.find('div').append(clone);
 });
 };
}

Вторая задача - создать контроллер и вставить службу $transclude, которая предварительно привязана к новой области. Ваша функция связывания клонов получит новую область действия в качестве ее второго параметра:

function Controller($element, $attrs, $transclude) {
 $transclude(function(clone, scope) {
 scope.name = $attrs.works2;
 $element.find('div').append(clone);
 });
}

В обоих случаях вам нужно будет предоставить функцию привязки клона, чтобы сделать сам переход, вместо использования ngTransclude.

См. http://jsfiddle.net/dbinit/wQC7G/6/ для примеров того и другого.


Если вы хотите создать модель у общего предка, чтобы действовать как коммутатор с целями $watch, вы можете использовать уже существующие средства, чтобы каждая директива мутировала и/или смотрела эту модель коммутатора. Компонентный режим доступа и контроллер содержимого содержат две поддельные сигнатуры вызовов для каждой области видимости, и есть небольшой "прием" для закрытого случая.

Изолированная область с двунаправленным связыванием

При регистрации области выделения директивы, = attrName "вызовет проверку свойства domainName с именем" attrName ". Angular установит двунаправленную привязку, так что изменение значения в модели области видимости влияет на модель в сфера брата/сестры.

Пример

В контроллере-parent.js:

module.controller( 'ParentController', function() {
 $scope.switchboard = { };
}

В директиве-sg-dialog.js

return {
 scope: {
 isolatedPeer: "=dialogModel"
};

... в метаданных директивы...

<div ng-controller="ParentController">
 <sg-dialog dialog-model="switchboard">
 
 </sg-dialog>
</div>

... в некотором шаблоне вида аппликатора и...

$scope.switchboard = { isApplied: false }

... в контроллере, связанным с шаблоном вида приложения...

Тогда вы все настроены на...

$scope.$watch( 'switchboard.isApplied', function(newValue, oldValue) { })

... в общем предке и получить обратный вызов после...

isolatedPeer.isApplied = true;

... в изолированной области.

Прототипное наследование

Пока вы явно не устанавливаете $scope.swtichboard в переведенном дочернем элементе, вы можете получить доступ к выражениям switchboard.isApplied из выражений Angular в переданном дочернем элементе и иметь механизм интерполяции "найти" значение thaat выделять dand, хранящиеся в родительском контроллере, в своей области.

Например, следующий обратный вызов будет вызван, когда будет закрыто диалоговое окно пары:

$scope.$watch( 'switchboard.isApplied', function(newValue, oldValue) { } );

Это работает, потому что зацикленный ребенок всегда получает базовую область, а не изолированную область.

Надеюсь, что это будет полезно!

licensed under cc by-sa 3.0 with attribution.