angular routerLink在带有模块的组件中不起作用

问题描述 投票:0回答:2

我正在尝试使用RouterLink,但没有任何反应。

我有两个组成部分,类别和保存类别。 savecategory在声明部分的app.module中定义,并且类别具有其自己的模块。所以我要将您的模块导入到导入中

App.module

@NgModule({
  declarations: [
    AppComponent,
    SavecategoriaComponent // <~ savecategory
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    FormsModule,
    HttpModule,
    HttpClientModule,
    LoginModule,
    CategoriaModule,           // <~~CategoryModule
    NgbModule.forRoot()
  ],
  providers: [],
  bootstrap: [AppComponent]
})

应用程序路由

const routes: Routes = [
  { path: 'login', component: LoginComponent },  
  { path: 'categoria', component: CategoriaComponent },
  { path: 'categoria/:id', component: CategoriaComponent },
  { path: 'savecategoria', component: SavecategoriaComponent },
  { path: '', pathMatch: 'full', redirectTo: 'login' }
];

Category.module

@NgModule({
  imports: [
    CommonModule,
    FormsModule,
    ReactiveFormsModule,
    FormsModule,   
    HttpClientModule 
  ],
  declarations: [
    CategoriaComponent
  ]
})

我正在使用以下路由器进入登录屏幕

<a routerLink="/">Home</a>

在保存类别中效果很好,但在类别中效果不佳。

类别中是否缺少任何导入?

angular typescript angular-ui-router
2个回答
1
投票

routes的routes数组描述了如何导航。将其传递到模块导入中的RouterModule.forRoot方法以配置路由器。

我在app.module.ts中包含了路线const

app.module.ts(摘录):

import { RouterModule } from '@angular/router';
....

const routes: Routes = [

  { path: 'login', component: LoginComponent },  
  { path: 'categoria', component: CategoriaComponent },
  { path: 'categoria/:id', component: CategoriaComponent },
  { path: 'savecategoria', component: SavecategoriaComponent },
  { path: '', pathMatch: 'full', redirectTo: 'login' }
];

@NgModule({
      declarations: [
        AppComponent,
        SavecategoriaComponent // <~ savecategory
      ],
      imports: [
        BrowserModule,
        FormsModule,
        RouterModule.forRoot(routes), //here for instance add it
        HttpModule,
        HttpClientModule,
        LoginModule,
        CategoriaModule,           // <~~CategoryModule
        NgbModule.forRoot()
      ],
        providers: [],
  bootstrap: [AppComponent]
})

Docs


-1
投票

如果一切正确,应该工作,检查类别模块的路由,很可能没有路由可以处理该链接。

© www.soinside.com 2019 - 2024. All rights reserved.