Is it possible to import an HTML file as a string with TypeScript?

Question

I wonder if it is possible to do as the title said.

For example let\'s say we are working on a Angular2 project and we want to avoid set the template as an external

Answer 1

@Veikedo's answer above almost works; however the * as portion means that the entire module is assigned to the pointer template whereas we only want the content. The compiler error looks like this:

ERROR in /raid/projects/pulse/angular-components/src/lib/card/card.ts (143,12): Argument of type '{ moduleId: string; selector: string; template: typeof '*.html'; encapsulation: ViewEncapsulation...' is not assignable to parameter of type 'Component'.

The corrected import statement (at the time of writing, using TypeScript 2.3.3) is as follows:

import template from "template.html";

@Component({
  selector: 'home',
  directives: [RouterLink],
  template: template
})