Question

我有两个组件，我想在点击div时从第一个组件转到第二个组件。

在我做的第一个组件中：

export class FirstComponent
{
    constructor(private router: Router)
    { }

    gotoLink(link: string)
    {
        console.log(link);
        this.router.navigate([link]);
    }
}

link参数从模板传递到组件，类似于my/second/path。

我创建了第二个组件和一个模块。该模块如下所示：

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

import { SecondComponent } from './second.component';

const routes: Routes = [
    {
        path     : 'my/second/path',
        component: SecondComponent 
    }
];

@NgModule({
    declarations: [
        SecondComponent
    ],
    imports     : [
        RouterModule.forChild(routes),
    ],
    providers   : [ ]
})
export class SecondModule
{
}

这是app.module：

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { HttpClientModule } from '@angular/common/http';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { RouterModule, Routes } from '@angular/router';

import { AppComponent } from './app.component';


const appRoutes: Routes = [
    {
        path        : 'private',
        loadChildren: './some/private/path/private.module#PrivateModule'
    },
    {
        path        : '**',
        redirectTo  : 'home'
    }
];

@NgModule({
    declarations: [
        AppComponent
    ],
    imports     : [
        BrowserModule,
        BrowserAnimationsModule,
        HttpClientModule,
        RouterModule.forRoot(appRoutes),
    ],
    bootstrap   : [
        AppComponent
    ]
})
export class AppModule
{
}

但是，路由不起作用。我错过了什么吗？

Answer 1

问题在于链接字符串应该是这样的的 /我的/第二/路径即可。它应该始终以正斜杠开头。

角度路由在组件内不起作用

1 个答案: