具有 2 个参数的角度路线不起作用答案

【问题标题】：Angular route with 2 parameters not working具有 2 个参数的角度路线不起作用
【发布时间】：2018-01-19 00:24:58
【问题描述】：

我有这个路由文件：

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { HomepageComponent } from './app/homepage/homepage.component';
import { SearchpageComponent } from './app/searchpage/searchpage.component';
import { EventPageComponent } from './app/eventpage/eventpage.component';

const routes: Routes = [
  {
    path: '',
    component: HomepageComponent
  },
  {
    path: 'search',
    component: SearchpageComponent
  },
  {
    path: 'event/:name/:id',
    component: EventPageComponent
  },
];

@NgModule({
  imports: [
    RouterModule.forRoot(routes)
  ],
  exports: [RouterModule]
})
export class AppRoutingModule {
}

每当我尝试导航到像 http://localhost:4200/event/asa/123 这样的 URL 时，它都不会加载 EventPageComponent（空白页），并且 Chrome 会在控制台中给我以下错误：

Failed to load resource: the server responded with a status of 404 (Not Found) (http://localhost:4200/event/asa/inline.bundle.js)

它对每个捆绑包都这样做。

我错过了什么吗？

【问题讨论】：

标签： javascript angular angular2-routing

【解决方案1】：

您在index.html 中的脚本引用似乎不正确。当它应该指向/inline.bundle.js（绝对）时，它似乎指向inline.bundle.js（相对于当前路径）。鉴于您的问题，这是我最好的猜测，我认为 Angular 代码没有任何问题（Angular 中的任何内容也不会产生此错误）。

如果您使用 webpack 之类的东西进行捆绑，他们无疑有解决方案。

【讨论】：

你是对的！问题是index.html 文件的基本定义错误。我将它从 <base href="./"> 更改为 <base href="/"> 非常感谢。