Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Using html file as template for component in angular 2

I have following app structure

app    home        home.html        home.ts        home.sass    app.component.ts index.html 

Essentially I want to divide my pages into separate folders that have style, .ts and .html files related to them

however at the moment loading a template like this

import {Component} from 'angular2/core';  @Component({     selector: 'admin-app',     template: 'home/home.html' }) export class AppComponent { } 

literary loads "home/home.html" string as a template where as I want html contents of the home.html file.

like image 726
Ilja Avatar asked Jan 12 '16 11:01

Ilja


People also ask

What is HTML template in Angular?

An Angular HTML template renders a view, or user interface, in the browser, just like regular HTML, but with a lot more functionality. When you generate an Angular application with the Angular CLI, the app. component. html file is the default template containing placeholder HTML.

What is Angular component template?

A template is a form of HTML that tells Angular how to render the component. Views are typically organized hierarchically, allowing you to modify or show and hide entire UI sections or pages as a unit. The template immediately associated with a component defines that component's host view.

What is a template in angular 2?

Angular 2 templating system gives us a syntax to express the dynamic part of our HTML. In Angular 2, a component needs to have a view. To define a view, you can define a template inline (using template) or in a separate file (using templateUrl).


1 Answers

I think that if you want to pass a template, you should use

templateUrl: 'home/home.html' 

That should make an http request and load the html into your component.

like image 66
Michele Ricciardi Avatar answered Oct 11 '22 00:10

Michele Ricciardi