Question

如何为在NodeJS上运行的WebApp加载Angular 2库？如果我不使用System.js，是否需要ng-app？或者我们是否需要在index.html中专门提及它？（虽然看起来不像那样）在呈现DOM时如何检测自定义组件？

Answer 1

它不需要像ng-app

这样的特殊标签/属性

关键是以主App类/组件作为参数调用bootstrap函数

import * as express from 'express';
import {ng2engine} from 'angular2-universal-preview';

// Angular 2
import {App} from './src/app';

let app = express();

// Express View
app.engine('.ng2.html', ng2engine);
app.set('views', __dirname);
app.set('view engine', 'ng2.html');


// static files
app.use(express.static(__dirname));


app.use('/', (req, res) => {
  res.render('index', { App });
});



app.listen(3000, () => {
  console.log('Listen on http://localhost:3000');
});

如果你想在服务器端渲染应用程序，你可以这样做：

{{1}}

Answer 2

您将需要System js在浏览器中加载角度应用程序。如上所述here系统js是

通用动态模块加载器 - 在浏览器和NodeJS中加载ES6模块，AMD，CommonJS和全局脚本。

这些代码：
<script src="systemjs.config.js"></script> <script> System.import('app').catch(function(err){ console.error(err); }); </script>

index.html中的

将import加载您的应用或应用程序代码。

Angular2构建块是需要从一个文件导出到import到另一个文件的组件/模块。 System.js在浏览器中加载这些模块。然后我们在index.html内有一个组件，例如在Angular 2引导我们的应用程序之后，<my-app>被替换。您可以阅读official quickstart了解更多信息

如何加载Angular 2库？

2 个答案: