Angular 角度6-在何处导入RouterModule以防止；Can'；t绑定到'；routerLink'；因为它不是'；t'的已知属性；a「；

我在放置RouterModule以防止路由器链接html错误时遇到困难

类别组件

• 显示类别列表
• 通过将albums元素添加到categories html:

• 单击类别将显示

相册组件

• 单击相册将更改路由并显示不同的组件

• 现在左边是专辑列表

• 通过将
  html元素添加到“导入”相册详细信息组件中，在单击相册时，右侧将显示相册详细信息

问题

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { MatProgressSpinnerModule } from '@angular/material';
import { AlbumsListComponent } from '../albums/albums-list/albums-list.component';
import { AlbumDetailComponent } from '../albums/album-detail/album-detail.component';
import { RouterModule } from '@angular/router';

@NgModule({
  imports: [
    CommonModule,
    MatProgressSpinnerModule
  ],
  declarations: [
    AlbumsListComponent,
    AlbumDetailComponent,
  ],
  exports: [
    AlbumsListComponent,
    AlbumDetailComponent,
    RouterModule
  ]
})
export class SharedModule { }

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { MatProgressSpinnerModule } from '@angular/material';
import { SharedModule } from '../shared/shared.module'
import { RouterModule } from '@angular/router';


@NgModule({
   imports: [
      CommonModule,
      MatProgressSpinnerModule,
      RouterModule,
      SharedModule
   ],
   declarations: [],
   exports: []
})
export class AlbumsModule { }

我已将RouterModule添加到categories模块，该模块允许我在HTML中使用

[RouterLink]

。但是，当我尝试在我的相册组件中使用

[RouterLink]

时，我得到了错误：

无法绑定到“routerLink”，因为它不是“a”的已知属性。（”

相册组件和相册详细信息组件位于“SharedModule”中。这允许我导出相册列表和相册详细信息组件，并将共享模块导入我的类别模块以使用它们

RouterModule应该导入到哪里？My albums module还是shared module？或者RouterModule可以声明为更高级别（appModule）以覆盖所有组件

类别模块

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { MatProgressSpinnerModule } from '@angular/material';
import { AlbumsListComponent } from '../albums/albums-list/albums-list.component';
import { AlbumDetailComponent } from '../albums/album-detail/album-detail.component';
import { RouterModule } from '@angular/router';

@NgModule({
  imports: [
    CommonModule,
    MatProgressSpinnerModule
  ],
  declarations: [
    AlbumsListComponent,
    AlbumDetailComponent,
  ],
  exports: [
    AlbumsListComponent,
    AlbumDetailComponent,
    RouterModule
  ]
})
export class SharedModule { }

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { MatProgressSpinnerModule } from '@angular/material';
import { SharedModule } from '../shared/shared.module'
import { RouterModule } from '@angular/router';


@NgModule({
   imports: [
      CommonModule,
      MatProgressSpinnerModule,
      RouterModule,
      SharedModule
   ],
   declarations: [],
   exports: []
})
export class AlbumsModule { }

注意：这个似乎很好用。类别html可以使用routerLink fine

共享模块

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { MatProgressSpinnerModule } from '@angular/material';
import { AlbumsListComponent } from '../albums/albums-list/albums-list.component';
import { AlbumDetailComponent } from '../albums/album-detail/album-detail.component';
import { RouterModule } from '@angular/router';

@NgModule({
  imports: [
    CommonModule,
    MatProgressSpinnerModule
  ],
  declarations: [
    AlbumsListComponent,
    AlbumDetailComponent,
  ],
  exports: [
    AlbumsListComponent,
    AlbumDetailComponent,
    RouterModule
  ]
})
export class SharedModule { }

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { MatProgressSpinnerModule } from '@angular/material';
import { SharedModule } from '../shared/shared.module'
import { RouterModule } from '@angular/router';


@NgModule({
   imports: [
      CommonModule,
      MatProgressSpinnerModule,
      RouterModule,
      SharedModule
   ],
   declarations: [],
   exports: []
})
export class AlbumsModule { }

相册模块

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { MatProgressSpinnerModule } from '@angular/material';
import { AlbumsListComponent } from '../albums/albums-list/albums-list.component';
import { AlbumDetailComponent } from '../albums/album-detail/album-detail.component';
import { RouterModule } from '@angular/router';

@NgModule({
  imports: [
    CommonModule,
    MatProgressSpinnerModule
  ],
  declarations: [
    AlbumsListComponent,
    AlbumDetailComponent,
  ],
  exports: [
    AlbumsListComponent,
    AlbumDetailComponent,
    RouterModule
  ]
})
export class SharedModule { }

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { MatProgressSpinnerModule } from '@angular/material';
import { SharedModule } from '../shared/shared.module'
import { RouterModule } from '@angular/router';


@NgModule({
   imports: [
      CommonModule,
      MatProgressSpinnerModule,
      RouterModule,
      SharedModule
   ],
   declarations: [],
   exports: []
})
export class AlbumsModule { }

app.router.ts

// Modules
import { ModuleWithProviders } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';

// Components
import { CategoriesComponent } from '../categories/categories.component';
import { AlbumsListComponent } from '../albums/albums-list/albums-list.component'


const appRoutes: Routes = [

  {
      path: 'categories',
      component: CategoriesComponent,
  },
  {
      path: 'categories/:categoryId/albums',
      component: CategoriesComponent,
  },
  {
      path: 'categories/:categoryId/album/:albumId',
      component: AlbumsListComponent,
  },
  {
      path: '',
      redirectTo: 'categories',
      pathMatch: 'full'
  },
  {
      path: '**',
      redirectTo: 'categories',
      pathMatch: 'full'
  }
];


export const AppRouting: ModuleWithProviders =   RouterModule.forRoot(appRoutes);

---

您在哪里定义路由？Hi@fatemefazli-在app.module I导入“AppRouting”，这是一个ts文件，我在其中定义路由。然后在app-routing.module导入中添加了

RouterModule.forChild（路由）

？我已经更新了我的帖子，以包括我如何配置路由文件。你认为我需要在这里进行一些更新吗？好的，已解决-它没有导入到共享模块中。相反，我正在导出它，认为它需要导出到项目列表中…：~|