Как направить дочерний компонент к другому дочернему компоненту - PullRequest
Новая
       15

Как направить дочерний компонент к другому дочернему компоненту

0 голосов
/ 02 апреля 2019

У меня есть два дочерних компонента в моем проекте google и dpikachu.

Мне нужно перенаправить страницу Google (когда я нажимаю кнопку рядом) на другой дочерний компонент pikachu.

это мой app-routing.module.ts 

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { AppComponent } from './app.component';
import { PikachuComponent } from './pikachu/pikachu.component';
import { GoogleComponent } from './google/google.component';
import {HomeComponent} from './home/home.component';

const routes: Routes = [
  { path: 'google', component: GoogleComponent },
  { path: 'pikachu', component: PikachuComponent  },
  {path: '', component: HomeComponent},
];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule { }

это мой app.module.ts 

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import {FormsModule} from '@angular/forms';

import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { PikachuComponent } from './pikachu/pikachu.component';
import { GoogleComponent } from './google/google.component';
import { HomeComponent } from './home/home.component';

@NgModule({
  declarations: [
    AppComponent,
    PikachuComponent,
    GoogleComponent,
    HomeComponent
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    FormsModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

любая помощь, пожалуйста

Ответы [ 2 ]

0 голосов
/ 02 апреля 2019

Вы можете попробовать сделать это. 

import { ActivatedRoute, Router  } from '@angular/router';

constructor(private route: ActivatedRoute, private router: Router) {}

navigateToChild(){
   this.router.navigate(['./pikachu'], { relativeTo: this.route });
}

тогда 

 <a target="_blank" rel="noopener" (click)="navigateToChild()"> <button class="btn-primary">Next</button></a>
0 голосов
/ 02 апреля 2019

Вы добавили импорт AppRoutingModule в app.module.ts?

@NgModule({ imports: [ BrowserModule, FormsModule, AppRoutingModule ],

...