angular动态选择HTML模板,在angular2中动态加载HTML模板

我创建了一个angular-cli包含AppComponent的项目,如下所示:

import { Component } from '@angular/core';

@Component({

selector: 'app-root',

templateUrl: './app.component.html',

styleUrls: ['./app.component.css']

})

export class AppComponent {

title = 'app works!';

}

和app.component.html一样

Good Morning, {{title}}

因此,当我使用ng build它生成它时会生成一些像这样的文件./dist/main.bundle.js,其中包含一些代码,如下所示 -

/* 586 */

/***/ function(module, exports) {

module.exports = "

\n Good Morning, {{title}}\n

\n"

/***/ },

/* 587 */

这意味着,在构建时,编译器/ bundle-er正在读取html文件并将它们连接到生成的js文件中.

但在我的情况下,html也是动态的,内容驱动的是服务器端.可以说,我的模板文件不是html,而是app.component.jsp,并且完全驻留在一些不同的服务器或文件夹上.

此JSP文件有时会返回

Good Morning, {{title}}

,有时还

Good Afternoon, {{title}}

取决于当前的服务器时间.

如何实现这一功能？

我的理解是,我需要定义某种加载器函数说: loadDynamicTemplate(template_url)

并且需要在Component decorator模板属性上使用该loader-function.在这种情况下,当生成main.bundle.JS时,它也将使用该函数.因此在运行时,angular将调用此函数并通过ajax加载HTML并使用它.

更新1

在这里,我发现SystemJS和Webpack之间存在一些差异.我还发现如果我们可以使用SystemJS,我们可以在运行时加载HTML文件.所以我相信这个问题可以通过SystemJS配置来解决.但是,为此,另一个问题开始发挥作用,尽管我认为这可能是一个单独的问题.所以我发布了一个新问题来解决这个问题.

可能如果这个问题得到解决,我会尝试使用SystemJS,然后在这里发布解决方案,如果有帮助的话.