Как заставить работать экспресс роутер в Angular 5?

Question

Я пытаюсь подключиться к серверу Express, используя Angular 5, но кажется, что он не работает.Я хочу разработать проект Mean Stack

index.js

const express = require('express');
const bodyParser = require('body-parser'); // Parses incomong requests like submitting a form
const path = require('path');

const api = require('./server/routes/api');

const port = 3000;
const app = express();

app.use(express.static(path.join(__dirname, 'dist')));

app.use(bodyParser.urlencoded({extended: true}));
app.use(bodyParser.json());

app.use('/api', api);

app.get('*', (req, res) => {
  res.sendFile(path.join(__dirname, 'dist/index.html'));
});

app.listen(port, function() {
  console.log("Now listening for requests: " + port)
});

/ server / routs / api.js

const express = require('express');
const router = express.Router();

router.get('/', function(req, res) {
  res.send('api works');
});

module.exports = router;

app.component.html

<!--The content below is only a placeholder and can be replaced.-->
<div style="text-align:center">
  <h1>
    Welcome to {{ title }}!
  </h1>
</div>
<h2>Here are some links to help you start: </h2>
<ul>
  <li>
    <h2><a target="_blank" rel="noopener" href="https://angular.io/tutorial">Tour of Heroes</a></h2>
  </li>
  <li>
    <h2><a target="_blank" rel="noopener" href="https://github.com/angular/angular-cli/wiki">CLI Documentation</a></h2>
  </li>
  <li>
    <h2><a target="_blank" rel="noopener" href="https://blog.angular.io/">Angular blog</a></h2>
  </li>

Когда я попытался запустить ng build и nodemon , затем перейти к http://localhost:3000/ Iпосмотрим, что внутри содержимого app.component.html

Я думаю, что я должен увидеть:

Приведенный выше код работает в Angular 4, но не в Angular 5. Любая помощь приветствуется.