Use with ng-include, ng-messages-include & friends?

[ClementParis016]

I was wondering what would be the good way to handle templates with ng-include or ng-messages-include.

For example, the following code will fail as it tries to load the template without hitting $templateCache:

<div ng-messages-include="error-messages.html"></div>

I've tried a few things, like writing import errorMessageTemplate from './error-messages.html in my main module, but it doesn't work :( Any suggestions?

[ClementParis016]

Pushing my investigation further, I came across #17 which led me to the following working solution:

/* my-form.controller.js */

import errorMessageTemplatePath from './error-messages.html';

class MyFormController {
  constructor() {
    this.errorMessageTemplatePath = errorMessageTemplatePath;
  }
  // ...
}

<!-- my-form.html -->

<!-- ... -->
<div  ng-messages="myForm.myField.$error">
  <div ng-messages-include="{{$ctrl.errorMessageTemplatePath}}"></div>
</div>
<!-- ... -->

It still feels a bit hack-ish but looking at how this loader works it makes complete sense.