Как передать $scope в angularjs 1.5 компонент/директива

Я пытаюсь использовать новый метод .component() в angular 1.5. В настоящее время я мало информации о том, как его использовать. Документы angular также не упоминают об этом.

Я пытаюсь передать область или объект из области действия в .component, который будет использоваться в части шаблона компонента, но только два параметра, которые я могу передать, - это $element и $attrs. Я пробовал передать объект через атрибут в html, но все, что я получил, было строкой имени объекта.

Я попытался настроить его таким образом как переменную

my-attr="item.myVal"
my-attr="{item.myVal}"
my-attr="{{item.myVal}}"

каждый раз, когда я все еще получаю строковый литерал, а не значение переменной. Как я могу настроить его для обработки как переменной?

Я попытался захватить данные с помощью новых привязок: {}, но мой шаблон: {} тогда не имел доступа к переменным.

Вот мой компонент, как сейчас:

export var ItemListAction = {
    controller: 'PanelCtrl as itemCtrl',
    isolate: false,
    template: ($element: any, $attrs: any): any=> {
        var myVal: any = $attrs.myAttr; // returns "item.myVal"
        var listAction: string = compileListAction();
        return listAction;
    }
};

Вот мой компонент в HTML

<panel-item-list-action my-attr="item.myVal"></panel-item-list-action>

Это объявление модуля angular для компонента: angular.module('Panel', []).component('panelItemListAction', ItemListAction)

Ответы

Ответ 1

Шаблонам не требуется $scope. Функции шаблона возвращают HTML. Вы можете вставлять $scope в контроллер, как всегда.

Это то, что Блог AngularJS говорит о компонентах:

module.component

Мы создали более упрощенный способ регистрации директив компонентов. По сути, компоненты - это специальные типы директив, которые привязаны к пользовательскому элементу (что-то вроде <my-widget></my-widget>), с соответствующим шаблоном и некоторыми привязками. Теперь, используя метод .component() в AngularJS 1.5, вы можете создать повторно используемый компонент с очень небольшим количеством строк кода:

var myApp = angular.module("MyApplication", [])
myApp.component("my-widget", {
  templateUrl: "my-widget.html",
  controller: "MyWidgetController",
  bindings: {
    title: "="
  }
});

Чтобы узнать больше о компоненте AngularJS 1.5, прочитайте статью Тодда Мотто: http://toddmotto.com/exploring-the-angular-1-5-component-method/

- http://angularjs.blogspot.com/2015/11/angularjs-15-beta2-and-14-releases.html