Angular 1,5-компонентная инъекция зависимости

Я пытаюсь использовать новый синтаксис Angular 1.5 component в проекте, но я не могу понять, как вставлять зависимость в определение компонента.

Здесь моя попытка рефакторинга существующей директивы для компонента:

angular
    .module('app.myModule')
    .component('row', {
      bindings: {
        details: '@',
        zip: '@'
      },
      controller: 'RowController',
      templateUrl: basePath + 'modules/row.html' // basePath needs to be injected
    })

По различным причинам мы вставляем константу basePath во все наши директивы как часть шаблонаUrl.

Как это сделать на компоненте, поскольку определение компонента не является функцией?

Ответы

Ответ 1

Вы можете использовать функцию templateUrl для создания URL-адреса. Однако, в отличие от директивы, компонент templateUrl инъективен (ref docs), что означает, что вы можете вводить константу (или любую другую инъекционную услугу) внутрь. Именно то, что вам нужно:

.component('row', {
  bindings: {
    details: '@',
    zip: '@'
  },
  controller: 'RowController',
  templateUrl: function(basePath, $rootScope) { // $rootScope is an example here
    return basePath + 'modules/row.html'
  }
})

Поддерживается также безопасная маркировка массивов:

templateUrl: ['basePath', '$rootScope', function(basePath, $rootScope) {
  return basePath + 'modules/row.html'
}]

Демо: http://plnkr.co/edit/jAIqkzZGnaEVPaUjyBrJ?p=preview