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));

问题是找不到header-template.html

我尝试了以下

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

是模板与正确导入的其他组件位于同一文件夹中。

有人知道这里的问题吗？

Answer 1

  

es模板与正确导入的其他组件位于同一文件夹中

修复

templateUrl实际上是浏览器加载文件后可以找到文件的URL。您最有可能在浏览器中获得404。查看在那里提出的请求并按摩它到您希望文件的位置。

更好的修复

使用您的加载程序将.html文件加载为text内容，并将其传递给template，而不必担心templateUrl