Принудительное действие двухстороннего связывания - PullRequest
Новая
       10

Принудительное действие двухстороннего связывания

0 голосов
/ 11 марта 2019

Я пишу директиву AngularJS 1.x (назовем ее MyDirective). Его объем объявляется следующим образом: 

scope: {
    accessor: '='
}

В его функции link я назначаю новый объект этому полю accessor, например: 

scope.accessor = {
    // methods such as doSomethingToMyDirective()
};

Теперь я инстанцирую эту директиву динамически с $compile: 

var element = $compile('<div data-my-directive data-accessor="directiveAccessor"></div>')(myScope);

После этого моя текущая область (myScope) имеет свойство directiveAccessor, которое ссылается на экземпляр объекта, созданный в директиве.

Проблема: Это поле не немедленно доступно.

Другими словами, после запуска $compile я не могу сразу получить доступ к myScope.directiveAccessor в следующей команде. Когда я проверю область видимости позже, поле будет там, и, вероятно, достаточно будет $timeout.

С некоторыми точками останова я могу заметить, что объект действительно создается именно тогда, когда выполняется $compile; accessor на внутренней области уже указывает на объект. Однако, похоже, что двусторонняя привязка, которая будет копировать значение из accessor во внутренней области в myScope.directiveAccessor, не станет активной до более поздней точки.

Есть ли способ заставить AngularJS немедленно скопировать двухсторонние значения (т. Е. Без ожидания какого-либо обещания)?

1 Ответ

0 голосов
/ 11 марта 2019

Используйте привязку выражения (&), чтобы сразу установить родительскую переменную области действия: 

app.directive("myDirective", function () {
    return {
        scope: { onPostLink: "&" },
        link: postLink
    };
    function postLink(scope, elem, attrs) {
        scope.accessor = {
            doSomethingToMyDirective: function() {
                return "Hello world";
            }
        };
        scope.onPostLink({$event: scope.accessor});
        scope.$on("$destroy", function() {
            scope.onPostLink({$event: null});
        });
    }
})

Использование: 

<my-directive on-post-link="directiveAccessor=$event">
</my-directive>

Обязательно null ссылка, когда область изоляции изолирована. В противном случае код может создать утечки памяти.

...