Question

编辑：我还没有找到使用import语句而不是require导入模板的方法，但我发现我可以简化配置。 < / p>

在webpack配置中，对html-loader使用ngtemplate-loader而不是/\.html$/。然后，在组件中，要求文件顶部的模板，就像我们在原始帖子中所做的那样，但是在组件定义中将“templateUrl”更改为“template”。 Webpack将完成剩下的工作你。

const template = require('./component.html');

class Example(){
    ...    
}

export const component = {
    bindings: {},
    controller: Example,
    template: template
};

原帖：

我有ngtemplate-loader的工作解决方案：

const template = require('./component.html');
import ExampleService from './example.service';

class Example() {
    constructor(private exampleService: ExampleService) {

    }
    ...
}

export const component = {
    bindings: {},
    controller: Example,
    templateUrl: template
};

但我担心我的同事会反对require语法。你看，我正在将我们的应用程序从Grunt迁移到Webpack2，而当前的应用程序只使用import foo from './bar'语法。

我们也不会在当前版本的javascript文件中导入模板;我们在templateUrl中使用回调来返回一个字符串。

import ExampleService from './example.service';

class Example() {
    constructor(private exampleService: ExampleService) {

    }
    ...
}

export const component = {
    bindings: {},
    controller: Example,
    templateUrl: ['constantsFactory', function(constantsFactory) {
        return `${constantsFactory.path}/component.html`;
    }]
};

是否有一个webpack加载器可以在没有require的情况下填充$ templateCache？

如果没有，有没有办法用import语法在Typescript中导入模板？

Answer 1

没有办法使用import语法向$ templateCache添加模板，但您可以使用＆＃39; require＆＃39;将模板添加到缓存中。语法。

angular1-templateurl-loader

我现在能找到的最好的装载机。

使用AngularJS + Webpack2包含模板的最佳方法是什么？

1 个答案: