Question

我有一个当前正在express.js上运行的项目，但是我想向该项目添加角度以处理前端，从而使其成为一个单页应用程序，当一个单击链接，从而重做已完成的操作。因此，我希望对整个网站进行角负荷，而服务器只能提供所需的部分。

我的css，js，图像等位于公共文件夹中，而html（使用模板引擎）位于views文件夹中。

当前的操作方式是调用路由，将属于该页面的数据（例如信息，表单，图像等）通过路由加载到视图中，然后将所有内容从views文件夹中加载，但是我我正在寻找一种仅发送所需信息而不发送整个网站内容（一种）的更好方法。

路由都是在node.js中确定的，angular甚至不知道在运行时会存在哪些链接，angular在运行时基本上会从node.js接收链接。

请我如何实现这一目标。

注意：angular只是现有的一个附加组件，主要工作在节点上

Answer 1

没有任何代码，答案将非常抽象，但这是您需要执行的主要步骤：

您将需要设置express.static中间件，以便express应用将为您的角度应用（通常是index.html）和图像提供服务：

app.use(express.static('public')) //images in here

app.use(express.static('dist')) //index.html in here

为此，您需要在ng build期间指定--output-path选项：

ng build --output-path ./dist

此外，请注意，每个角度组件都有自己的样式表。因此，您要么必须移动在每个组件的样式表中定义的.css样式，要么将它们添加到styles数组下的angular.json文件中：

"styles": [
    "styles.css",
  ],

2。修改您的快速应用程序以仅提供index.html文件。其他一切将由API路由器处理，该API路由器仅将数据提供给角度应用：

// Set our api routes
app.use('/api', api);

// Catch all other routes and return the index file
app.get('*', (req, res) => {
  res.sendFile(path.join(__dirname, 'dist/index.html'));
});

您将需要设置Angular路由器来处理组件之间的导航。这将是特定于您的项目结构的，但是有许多教程可以帮助您进行设置。

让我知道是否需要进一步的澄清。

javascript：协调角度以从node.js接收数据

1 个答案: