Angular 1.5 component dependency injection Angular 1.5 component dependency injection angularjs angularjs

Angular 1.5 component dependency injection


You can use a function for templateUrl to construct URL. However, unlike the one for directives, component templateUrl function is injectable (ref docs), which means that you can inject constant (or any other injectable service) into it. Exactly what you need:

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

Minification-safe array notation is also supported:

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

Demo: http://plnkr.co/edit/jAIqkzZGnaEVPaUjyBrJ?p=preview