Использование функции подключения клонирования transclude для добавления данных, доступных для включенного содержимого в Angular 1.5.8?

Я хотел бы сделать несколько выбранных свойств контроллера моего компонента видимыми в области содержимого, включенного в этот компонент. Я пытаюсь сделать это, следуя примеру Теро Парвиайнена для angular 1.4 здесь: http://jsbin.com/pibuqa/1/edit?html,css,js,output (из http://teropa.info/blog/2015/06/09/transclusion.html).

Однако мне не повезло с angular 1.5.8. Насколько я могу судить, изменения, которые я внес в $ scope в функции подключения клонирования transclude, не имеют никакого эффекта: http://plnkr.co/edit/Mr69lBZJswaM6MSyWwTP?p=preview

Моя цель:

<my-component> <div>{{something}} will be set to "blah"</div> <my-component>

component('myComponent', { transclude: true, template: '<div ng-transclude></div>', controller: function ($transclude) { $transclude(function (transEl, transScope) { transScope.something = "blah"; } }})

Изменить: я считаю, что мне нужно самому вставить включенный текст, вместо того, чтобы полагаться на ng-transclude при выполнении таких вещей. (ng-transclude самостоятельно включал контент. Моя функция присоединения клона работала и ничего не делала эффективно, так как не манипулировала dom.)


angularjs angularjs-directive angularjs-scope angularjs-components
person FullTimeCoderPartTimeSysAdmin    schedule 09.08.2016    source источник

Ответы (1)


arrow_upward
1
arrow_downward

Проблема, с которой вы сталкиваетесь, возникает из-за того, что вы используете ng-transclude в своем шаблоне, а затем вызываете $ transclude в своем контроллере. Контент был привязан к шаблону, а свойство something было установлено в другой области. Вам нужно удалить ng-transclude из ваших шаблонов и добавить контент в свой cloneLinkingFn:

$transclude(function (transEl, transScope) {
        // Set something property
        transScope.something = "something else";
        // Now append transcluded element to your element
        $element.append(transEl);
    });

Вот обновленный plnkr: http://plnkr.co/edit/4WWmyPcYuGmGh4dPGNmi?p=preview/ а>

person Patrick    schedule 10.08.2016