TemplateUrl无法找到我的模板

Question

头组分

import { Component } from "angular2/core"; 

@Component({ 
    selector: "header-component", 
    templateUrl: "header-template.html" 

}) 

export class HeaderComponent { 

} 

主要成分

import {Component} from "angular2/core"; 
import {bootstrap} from 'angular2/platform/browser'; 

// Components 
import { HeaderComponent } from "./header.component"; 
import {ParametersForm} from './form' 

@Component({ 
    selector: "my-app", 
    directives: [ParametersForm, HeaderComponent], 
    template: ` 
    <header-component></header-component> 
    <parameters-form></parameters-form> 
    ` 
}) 

class MainApp { 

} 

bootstrap(MainApp) 
    .catch(err => console.error(err)); 

问题是标题，template.html没有找到

我尝试以下

templateUrl: "header-template" 
templateUrl: "header-template.html" 
templateUrl: "./header-template.html" 

yes templa te与其他正确导入的组件位于同一文件夹中。

有人知道这里的问题吗？

Answer 1

ES模板是在同一文件夹中的部件的其余部分，其得到正确导入

修复

的templateUrl实际上是该文件可以位于URL一旦文件被加载由浏览器。您最有可能在浏览器中获得404。查看在那里做出的请求，并按照它来预期文件的位置。

最好修补

使用您的装载机到.html文件加载为text内容并传递到template，并且不与templateUrl