Можно ли внедрить службу в свойство templateUrl компонента Angular 1.5?

Моей директиве нужна константа (MODULE_ROOT_URL) для создания пути к шаблону. С синтаксисом директивы я могу внедрить константу в функцию фабрики каталогов. Как преобразовать эту директиву в компоненты Angular 1.5? Можно ли внедрить службу в компоненты Angular 1.5?

Спасибо.

Обновление: я знаю, что службу можно внедрить в контроллер компонентов. Но как я могу внедрить службу для свойства templateUrl компонента?

Обновление 2: см. plnkr. Я создаю как директивную, так и компонентную версии. Директивная версия работает нормально. Но версия компонента имеет ошибку [ngTransclude:orphan]

https://plnkr.co/edit/DMumuIpXJY6RDCX6XObz?p=preview

angular.module('AbcModule')
       .directive('abcDirective', ['MODULE_ROOT_URL', function (MODULE_ROOT_URL) {
           return {
               restrict: 'E',
               templateUrl:  MODULE_ROOT_URL + 'abc/abc.tpl.html'
           }

       }]);

person Community    schedule 13.04.2016    source источник
comment
Возможный дубликат внедрения зависимостей компонентов angularjs 1.5   -  person medievalgeek    schedule 13.04.2016


Ответы (2)


templateUrl и template могут быть функциями, а зависимости могут быть внедрены.

angular.module('AbcModule')
.component('abcDirective',  {
     restrict: 'E',
     templateUrl:  function(MODULE_ROOT_URL) {
          return MODULE_ROOT_URL + 'abc/abc.tpl.html';
     }
});
person a better oliver    schedule 15.04.2016
comment
@PankajParkar Это верно для .directive, но не для .component. Не стесняйтесь читать документы и пробовать. - person a better oliver; 16.04.2016
comment
извините, вы прекрасны. +1, я удалю свой ответ, как только OP примет этот ответ. Я просто добавил комментарий в свой ответ, чтобы сообщить, что ваш ответ правильный. :-) - person Pankaj Parkar; 16.04.2016
comment
вы должны отметить, что метод инъекции, показанный здесь, не является безопасным для минимизации. Значением templateUrl также может быть массив, в котором внедряемые сервисы указаны в виде строк, а последним элементом массива является функция templateUrl: ['MY_CONST', function (MY_CONST) { ... }]. - person danwellman; 25.05.2016

До версии Angular 1.4 функция возвращала directive DDO, где у вас могут быть зависимости в определенном месте. Но здесь, в Angular 1.5.3, мы можем добавить зависимость внутри controller компонента. Вы можете обойти это, как показано ниже, используя ng-include и внедрив зависимость внутри контроллера.

Разметка

angular.module('AbcModule')
.component('abcDirective', {
  template: '<div ng-include="$ctrl.rootUrl ? $ctrl.rootUrl + \'abc/abc.tpl.html\': \'\'"></div>',
  controller: function(MODULE_ROOT_URL) { //<--injected dependency here.
    var self = this;
    self.rootUrl = MODULE_ROOT_URL;
  }
}]);
person Pankaj Parkar    schedule 13.04.2016
comment
Спасибо. Но это не работает с ng-transclude. Если шаблон включает в себя ng-transclude, я установил transclude: true, пользовательский контент не будет загружаться в компонент. - person ; 14.04.2016
comment
@thermostat, можете ли вы предоставить мне plunkr/fiddle? - person Pankaj Parkar; 14.04.2016
comment
Спасибо. Пожалуйста, смотрите plnkr. Я создаю как директивную, так и компонентную версии. Директивная версия работает нормально. Но версия компонента имеет ошибку [ngTransclude:orphan] plnkr.co/edit/DMumuIpXJY6RDCX6XObz?p=preview - person ; 14.04.2016
comment
@thermostat посмотрите на приведенный выше ответ, добавленный zeroflagL, который многообещающ в вашем случае. - person Pankaj Parkar; 16.04.2016