Question

我正在尝试使用universal和angular4 ..一切正常，也可以通过哈希路径直接访问..但问题是请求始终显示<body><demo-app></demo-app></body>

我希望<demo-app></demo-app>

中有一些html标签和信息

以下是我实施的方法：

@NgModule({
  bootstrap: [AppComponent],
  imports: [
    BrowserModule.withServerTransition({
      appId: 'my-app-id'
    }),
    ServerModule,
    ServerTransferStateModule,
    AppModule
  ]
})

export class ServerAppModule {

  constructor(private transferState: TransferState,
  private translateService: TranslateService){
    translateService.use('en');
  }
  // Gotcha
  ngOnBootstrap = () => {
    this.transferState.inject();
  }
}


app.engine('html', ngExpressEngine({
  bootstrap: ServerAppModule
}));

app.set('view engine', 'html');
app.set('views', 'src');


app.get("*", (req, res) => {
  console.time(`GET: ${req.originalUrl}`);
  res.render('../dist/index', {
    req: req,
    res: res
  });
  console.timeEnd(`GET: ${req.originalUrl}`);
});

我的版本是“@ angular / common”：“^ 4.0.0”

使用https://github.com/angular/universal/blob/master/modules/ng-express-engine/src/main.ts和import { ngExpressEngine } from '@nglibs/universal-express-engine'

进行测试

在讨论之后，我可以看到这是

的新实现

https://github.com/angular/universal/pull/681/files

尝试按照建议导入，但不起作用（名称空间不存在）

从'@ universal / ng-express-engine'

按照此拉取请求中的建议，使用版本rc.5进行测试。

最后，点击此链接

https://github.com/angular/universal/tree/master/modules/ng-express-engine

使用此lib测试给出了相同的结果：

import { ngExpressEngine } from '@nguniversal/express-engine';

至少项目正在运行，所以我可以继续编码和使用它......但期待有一个完整的服务器端渲染。

谢谢！

Answer 1

对于使用平台服务器的Angular 4+，请使用官方的 @nguniversal/express-engine ，另一个看起来像某个人因某些原因发布的快速引擎的旧版本？

命名空间现在将成为@nguniversal，所以尽快给出一个，你应该没问题！

您可以在最新的通用快递引擎（适用于Angular 4+和平台服务器）上找到文档：

https://github.com/angular/universal/tree/master/modules/ng-express-engine

Answer 2

感谢@ mark-pieszak的关注和支持！

我可以使用https://github.com/clbond/angular-ssr使用角度材质和一切......非常好=）

Angular4 Universal Server Side Rendering将根据请求返回更多HTML呈现

2 个答案: