在带有 Webpack 和 Typescript 的 AngularJS 1.5 组件中使用外部 HTML 模板答案

【问题标题】：Using an external HTML template in AngularJS 1.5 component with Webpack and Typescript在带有 Webpack 和 Typescript 的 AngularJS 1.5 组件中使用外部 HTML 模板
【发布时间】：2016-09-14 11:11:31
【问题描述】：

我正在尝试将外部 html 文件加载到我的 Angular 组件中：

import { LoginController } from './login.controller';
import './login.scss';
import './login.html';

class LoginComponent implements ng.IComponentOptions {

    public template: string;
    public controller: Function;
    public bindings : any;

    constructor(){
        this.controller = LoginController;
        this.bindings = {
            username: '@',
            password: '@'
        };
        this.template = //login.html referred to here
    }

}

export { LoginComponent };

我正在使用带有以下tsconfig.json 的打字稿：

{
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "sourceMap": true
  },
  "exclude": [
    "typings/main.d.ts",
    "typings/main",
    "node_modules"
  ]
}

我正在尝试使用html-loader 加载。

我不知道如何在组件本身中引用导入的 HTML？

webpack 构建有效。

【问题讨论】：

标签： angularjs typescript components commonjs

【解决方案1】：

自己解决了。

我必须在我的typings.json 中添加打字稿定义以供要求。

typings install --save --global require

现在像魅力一样工作:)

【讨论】：