Angular 1.5 component method templateUrl + function

Question

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 1

In 1.5.0-beta.2 templateUrl can be a function that is invoked by injector. $element and $attrs are injected into both template and templateUrl functions in component, as well as any other dependencies.

This means that

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

can be done instead.

Answer 2

@estus solution worked for me until I uglified my scripts. Uglified it gave the following error:

Error: [$injector:unpr] Unknown provider: eProvider <- e

The solution that worked for me is:

['$element', '$attrs', function($element, $attrs) {
    return $attrs.uninterpolatedTemplateUrl;
}]