Javascript 为什么在选择初始加载页面时出错？

当我在我的功能模块中选择上传的初始组件时

GalleryModuleModule

此组件

GalleryComponent

我得到这个错误：

路由“”的

配置无效：无法指定数组（所有组件都在
GalleryModuleModule
中）。告诉我我做错了什么以及如何解决这个问题

应用程序模块：

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';
import { GalleryModuleModule } from './gallery-module/gallery-module.module';

@NgModule({
    declarations: [
        AppComponent,
    ],
    imports: [
        BrowserModule,
        GalleryModuleModule,
    ],
    providers: [],
    bootstrap: [AppComponent]
})
export class AppModule {
}

<div class="container">
    <router-outlet></router-outlet>
</div>

import {NgModule} from '@angular/core';
import {CommonModule} from '@angular/common';
import {GalleryComponent} from "./gallery/gallery.component";
import {GalleryAddComponent} from './gallery/gallery-add/gallery-add.component';
import {RouterModule, Routes} from "@angular/router";

const appRoutes: Routes = [
    {path: '', redirectTo: '/gallery', pathMatch: 'full'},
    {path: 'gallery-add', component: 'GalleryAddComponent'},
];

@NgModule({
    imports: [
        CommonModule,
        RouterModule.forRoot([
            appRoutes,
            {enableTracing: true}
        ])
    ],
    declarations: [GalleryComponent, GalleryAddComponent],
    exports: [GalleryComponent, GalleryAddComponent RouterModule],
})
export class GalleryModuleModule {
}

app.component.html:

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';
import { GalleryModuleModule } from './gallery-module/gallery-module.module';

@NgModule({
    declarations: [
        AppComponent,
    ],
    imports: [
        BrowserModule,
        GalleryModuleModule,
    ],
    providers: [],
    bootstrap: [AppComponent]
})
export class AppModule {
}

<div class="container">
    <router-outlet></router-outlet>
</div>

import {NgModule} from '@angular/core';
import {CommonModule} from '@angular/common';
import {GalleryComponent} from "./gallery/gallery.component";
import {GalleryAddComponent} from './gallery/gallery-add/gallery-add.component';
import {RouterModule, Routes} from "@angular/router";

const appRoutes: Routes = [
    {path: '', redirectTo: '/gallery', pathMatch: 'full'},
    {path: 'gallery-add', component: 'GalleryAddComponent'},
];

@NgModule({
    imports: [
        CommonModule,
        RouterModule.forRoot([
            appRoutes,
            {enableTracing: true}
        ])
    ],
    declarations: [GalleryComponent, GalleryAddComponent],
    exports: [GalleryComponent, GalleryAddComponent RouterModule],
})
export class GalleryModuleModule {
}

您确实执行了
{path:''，重定向到：'/gallery'，pathMatch:'full'}，
，但实际上您没有一个名为
gallery
的路径应该重定向到。
例如，将路由配置更改为：

const appRoutes: Routes = [
    {path: '', redirectTo: '/gallery', pathMatch: 'full'},
    {path: 'gallery', component: GalleryComponent},
    {path: 'gallery-add', component: GalleryAddComponent},

];

移除
RouterModule.forRoot（）中的额外数组（如@Suresh所述）应该可以

PS：不要忘记导入路由配置中列出的组件（它们不应引用为字符串）
请参见，RouterModule.forRoot（）只需在根路由器模块App.module.ts中定义。但您正在子模块“GalleryModuleModule”中定义这些根路由，该子模块导入到app.Module.ts中

import {NgModule} from '@angular/core';
import {CommonModule} from '@angular/common';
import {GalleryComponent} from "./gallery/gallery.component";
import {GalleryAddComponent} from './gallery/gallery-add/gallery-add.component';
import {RouterModule, Routes} from "@angular/router";

const appRoutes: Routes = [
    {path: '', redirectTo: '/gallery', pathMatch: 'full'},
    {path: 'gallery-add', component: 'GalleryAddComponent'},
];

@NgModule({
    imports: [
        CommonModule,
        RouterModule.forRoot(
            appRoutes,
            {enableTracing: true}
        )
    ],
    declarations: [GalleryComponent, GalleryAddComponent],
    exports: [GalleryComponent, GalleryAddComponent RouterModule],
})
export class GalleryModuleModule {
}

尝试将GalleryAddComponent而不是GalleryAddComponent作为“gallery add”路径组件传递。另外，您似乎正在重定向到“/gallery”，并且尚未定义“/gallery”路径。添加此路由以防止重定向到不存在的路径。
{path:''，重定向到：'/gallery'，pathMatch:'full'}，
路由中是否缺少
/gallery
。像这样添加：
{path:'gallery'，component:GalleryComponent}，
也不要像这样添加带有
字符串（''）
的组件：
组件：'GalleryAddComponent'
，只需在没有字符串的情况下使用：
组件：GalleryAddComponent
。如果我写{path:''，重定向到：'/GalleryAddComponent'，路径匹配：'full'}我有同样的problem@IgorShvets你重定向到
路径
值而不是
组件
的路径，重新检查我的答案。我不敢回答这个问题，我的所有组件都在“gallery module.module”模块内，可能路径有问题？我发现了问题。您需要删除forRoot（）方法中的数组。还应修复appRoutes配置。