CODEWITHSUNDEEP
javascriptangular
Aaron
Aaron

Reputation: 1332

How can I use <html> templates in Angular2?

I want to replace my in-code template with html file. How can I do it?

Greeting.annotations = [
    new angular.ComponentAnnotation({
        selector: 'greeting'
    }),
    new angular.ViewAnnotation({
        template: '<h1>Hello!</h1>'
    })
];

I want something like this 

template: 'path/to/my/template.html'

I use Angular2 and ES5.

Upvotes: 2

Views: 5005

Answers (3)

Pardeep Jain
Pardeep Jain

Reputation: 86800

As provided by Angular officials you can import external HTML file by using TemplateUrl in ComponentAnnotation as well as in ViewAnnotation too. moreover you have option to use Template in the same ComponentAnnotation and ViewAnnotation.

update:

@view has been deprecated so only way to provide html is using @component like this

@component({
  ..
  template: `<h1>This is inline template </h1>`
   or
  templateUrl : 'URL FOR your html page';
  ..........
})
....

Upvotes: 1

Brocco
Brocco

Reputation: 65053

As part of the ComponentAnnotation there is a property templateUrl which you can point at an HTML file.

  • template - points at raw HTML
  • templateUrl - points at a URL containing the HTML

This is the same as angular 1.x directive definition object

You can find more information about component's properties here

NOTE - docs are still a work in progress

Upvotes: 6

Usama Noman
Usama Noman

Reputation: 503

Probably in your template you can refer to another HTML file, such as:

<ng-include src="'templates/[new template file].html'"></ng-include>

Upvotes: -4

Related Questions