具有参数重新加载页面更改的 Angular2 路由器获取 CSS 文件目录

Question

通常情况下，如果我在主页 link 上单击 link 来详细说明 link，例如 <a routerLink="/detail/{{record.TA001}}">，它运行良好并且 css 文件得到很好。

因为只有我刷新了这个详情页，点赞localhost:3000/detail/0006 数据正常，但是获取 CSS 文件将目录更改为 detail 而不是根目录，无法获取 CSS 文件。我的详细组件在 app/content 目录中。

我的index.html和CSS文件在项目根目录。路由器：

const appRoutes: Routes = [
  {
    path: 'contact',
    component: Contactcomponent
  },
  {
    path: 'detail/:id',
    component: Detailcomponent
  },
  { path: '',
   component: Contentcomponent
  }

我的项目目录是这样的：

Answer 1

我知道如何解决这个问题，只需将路由器指令 /detail/0005 更改为 /0005，即可正常唤醒。我认为这是 root 的路由器，所以你可以使用一级就好了。它不能使用二级方法，如果你的路由器不是 root 的，它可以使用它。

Answer 2

如果你想使用相对路径而不是每次都计算绝对路径（使用 ../ ../../ 等），你应该在你的组件声明中使用 moduleID 属性解释here.

Answer 3

在包含 css/stylesheet

之前检查 index.html 中是否包含 base href="/"

具有参数重新加载页面更改的 Angular2 路由器获取 CSS 文件目录

Angular2 router with param reload page change get CSS file directory

css

angular

reload

router

params