包括另一个用的WebPack角模板 [英] Include an angular template in another using webpack

问题描述

我在使用角度和的WebPack的问题。我的项目是与控制器组成的倍数意见。

I have an issue using angular and webpack. My project is composed of multiples views with controllers.

例如，我有一个观点 userSummary.tmpl.html 其中加载所有用户的列表。我想重用另一个该模板 groupSummary.tmpl.html 这显示所有用户了。

For example, I have a view userSummary.tmpl.html which load the list of all users. I would like to reuse this template in another groupSummary.tmpl.html which display all users too.

我不能使用NG-包括因为我所有的意见都包含在一个bundle.js，没有别的。我想用的WebPack直接包含在另一个我的看法。

I can't use ng-include because all my views are contained in a bundle.js, nothing else. I would like to use WebPack to include my views directly in another.

这可能吗？

推荐答案

为使您必须配置对于relativeTo参数，否则您的模板谐音得到在/家庭/用户名/路径/要/项目/路径加载/到/模板/（检查bundle.js你可能泄露您的用户名在您的项目）

To enable you must to configure the "relativeTo" parameter, otherwise your template partials get loaded at "/home/username/path/to/project/path/to/template/" (Check your bundle.js you're probably leaking your username in your projects)

var ngTemplateLoader = (
    'ngtemplate?relativeTo=' + path.resolve(__dirname, './src/') +
    '!html'
);

module.exports = {
    ...
    module: {
        loaders: [
            {test: /\.html$/, loader: ngTemplateLoader},
        ],
    },
    ...
}

然后在你的code，做一个副作用只需要：

Then in your code, do a side-effect only require:

// src/webapp/admin/js/foo.js
require('../../templates/path/to/template.html');

然后就可以加载HTML：

Then you can load the html:

<div ng-include src="'/webapp/templates/path/to/template.html'"</div>

这篇关于包括另一个用的WebPack角模板的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！