Angular 2 路由器：无法匹配任何路由

Question

在我的浏览器中尝试加载 localhost:3000/verifyemail 时，我收到错误：

错误：无法匹配任何路由

我已经阅读了关于此的其他 SO 问题，并验证了以下内容：

• Angular2：2.3.1默认使用Path Location Strategy，我没改过。我不喜欢使用哈希定位策略

• 我已经为 HTML5 pushState 配置了我的 Nodejs 服务器（server.js 在下面）

  // Parsers for POST data
  app.use(bodyParser.json());
  app.use(bodyParser.urlencoded({ extended: false }));
  
  // Point static path to dist
  app.use(express.static(path.join(__dirname, 'dist')));
  
  // Get API routes
  const api = require('./src/server/routes/api.js');
  
  // Set 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'));
  });
  
  const port = process.env.PORT || '3000';
  app.set('port', port);
  
  const server = http.createServer(app);
  server.listen(port, () => console.log(`API running on localhost:${port}`));
  

• 我的 index.html 中 <head> 的顶部有 <base href="/">

• 我设置了默认和包罗万​​象的路线

  const appRoutes: Routes = [
    { path: 'home',
      outlet: 'full-page',
      component: DefaultLandingPageComponent
    },
  
    { path: 'verifyemail',
      outlet: 'full-page',
      component: EmailVerificationComponent
    },
  
    { path: '',
      redirectTo: '/home',
      pathMatch: 'full'
    },
  
    { path: '**',
      outlet: 'full-page',
      component: DefaultLandingPageComponent
    }
   ];
  

• 我已将路由器模块导入到我的 app.module.ts 中，并在我的 app.component.html 文件中包含了一个路由器插座

  //in app.module.ts:
  @NgModule({
    ...
    imports: [
      ...
      RouterModule.forRoot(appRoutes)
    ]
    ...
    });
  
  //in app.component.html
  import { RouterModule, Routes } from '@angular/router';
  

非常感谢谁能帮我解决这个问题！

更新 1 由于 Günter Zöchbauer 在下面的 cmets 中的观察，我已经从路由和路由器插座中删除了所有名称

更新 2 在 localhost:4200/verifyemail 上一切正常，通过ng serve 运行。 使用通过node server.js运行的localhost:3000/verifyemail 时问题仍然存在

Answer 1

每个路由都需要一个将组件添加到未命名插座的路由。 已命名的 outlet 只能与未命名的 outlet 一起使用，不能代替。