Angular Material + Angular Universal

Question

我正在尝试在服务器端的 Nodejs + Expressjs 上使用 Angular Universal 呈现 Angular 应用程序。通过 ng build --prod --app 1 构建应用程序并使用 webpack 编译并通过 node server.js 运行应用程序后。当我在浏览器中打开应用程序时出现错误 当前文档没有文档类型。这可能会导致某些 Angular Material 组件无法按预期运行。

// Load zone.js for the server.
require('zone.js/dist/zone-node');
require('reflect-metadata');

import * as express from 'express';
import { enableProdMode, ValueProvider } from '@angular/core';
import { renderModuleFactory } from '@angular/platform-server';
import { join } from 'path';
import { readFileSync } from 'fs';
const { provideModuleMap } = require('@nguniversal/module-map-ngfactory-loader');
const { AppServerModuleNgFactory, LAZY_MODULE_MAP } = require('./dist-
server/main.bundle');

const template = readFileSync('./src/index.html', { encoding: 'utf8' });

const app = express();

app.engine('html', (_, options, callback) => {
  const opts = {
    document: template,
    url: options.req.url,
    extraProviders: [
      <ValueProvider>{
        provide: 'REQUEST',
        useValue: options.req,
      },
      provideModuleMap(LAZY_MODULE_MAP)
    ]
 };

renderModuleFactory(AppServerModuleNgFactory, opts)
  .then(html => callback(null, html));
});

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

app.get('*.*', express.static(join(__dirname, 'dist-server')));

app.get('*', (req, res) => {
  res.render('index', {req});
});

app.listen(5000, () => {
  console.log('listening on http://localhost:5000!');
});

看起来这个错误与@angular/material 相关，将来会修复，但是有什么解决方法吗？

Answer 1

目前，Angular Universal 不支持 Angular Material 2。 https://github.com/angular/universal#in-progress