Внедрение зависимостей компонентов 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 во все наши директивы как часть templateUrl.

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


angularjs angularjs-components
person epb    schedule 14.05.2016    source источник

Ответы (1)


arrow_upward
14
arrow_downward

Вы можете использовать функцию для templateUrl для создания URL. Однако, в отличие от функции для директив, функция компонента templateUrl вводится (ссылка 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

person dfsq    schedule 14.05.2016
comment
Идеальный! Мне не приходило в голову превратить templateUrl в функцию. - person epb; 14.05.2016