Question

我想这是一个简单的问题，但我不知道它是从哪里来的。我的路由器根本不起作用！

导航栏：

<ul class="navbar-nav ml-auto">

        <li class="nav-item">
<a routerLink="admin" routerLinkActive="active">Admin</a>
        </li>
        <li class="nav-item">
          <a href="#contact" class="nav-link">Home</a>
        </li>

      </ul>

app.module：

import { AppRoutingModule } from './app-routing.module';
import { RouterModule } from '@angular/router';



  @NgModule({
      declarations: [AppComponent, NavbarComponent, HomeComponent, AdminComponent],
      imports: [
        BrowserModule,
        BrowserAnimationsModule,
        FormsModule,
        AppRoutingModule,
        RouterModule,
      ], etc

App.routingModule

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { HomeComponent } from './components/home/home.component';
import { AdminComponent } from './components/admin/admin.component';

const routes: Routes = [
  {
    path: '**',
    component: HomeComponent
  },
  { path: 'admin', component: AdminComponent }
];
@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule {}

无论如何，我在“ a”中输入的内容都不会出现，因此不会显示管理页面。我从stackBlitz得到的一个提示是，他不认为我的AppRoutingModule是一个模块……有人可以帮我吗？

Answer 1

您不需要更改进出口，而是可以更改JOIN。路由的顺序至关重要，来自文档：

路由在配置中的顺序很重要，这是通过设计。路由器在匹配时使用首个匹配获胜策略路线，因此应将更具体的路线放在不那么具体的上方路线。在上述配置中，具有静态路径的路由为首先列出，然后是与默认路由。通配符路由排在最后，因为它匹配每个 URL，并且只有在没有其他路由首先匹配时才应选择。

尝试以下操作，将“包罗万象”路由置于数组末尾，并添加“ default” / routes路由以转到''

HomeComponent

希望有帮助！

角度：“ AppRoutingModule”被忽略并且路由不起作用

1 个答案: