tuvokki tuvokki - 7 months ago 239
Javascript Question

Angular 1.5 component method templateUrl + function

I'm trying to get an app working with angular 1.5.0-beta.2

To make a 'directive' I have the following code:

myApp.component('gridshow', {
bindings: {
slides: '='
},
controller: function() {

},
controllerAs: 'grid',
template: function ($element, $attrs) {
// access to $element and $attrs
return [
'<div class="slidegrid">',
'<div ng-repeat="slide in grid.slides">',
'{{slide.image}}',
'</div>',
'</div>'
].join('')
}
});


I like the idea of the template that returns a function with access to
$element
and
$attrs
but how do I combine this with a templateUrl?

Answer

In 1.5.0-beta.2 $element and $attrs are injected into both template and templateUrl functions in component.

This means that

  ...
  templateUrl: function ($element, $attrs) {
    // access to $element and $attrs
    ...
    return $attrs.uninterpolatedTemplateUrl;
  }

can be done instead.