Angular 2 - Merutekan dari komponen `anak pertama` ke komponen `anak kedua` dari komponen induk

Saya mencoba melakukan perutean sederhana dari komponen anak ke komponen anak lain dari komponen induk. router-outlet didefinisikan dalam komponen induk. Inilah cara saya mencoba mencapainya:

parent.ts

import {Component} from 'angular2/core';
import {RouteConfig,ROUTER_PROVIDERS,ROUTER_DIRECTIVES} from 'angular2/router';
import {bootstrap} from 'angular2/platform/browser';
import {FirstChildCmp} from "./first_child";
import {SecondChildCmp} from "./second_child";

@Component({
  selector: 'app',
  template: `
  <router-outlet></router-outlet>
  `,
  directives: [ROUTER_DIRECTIVES]
})
@RouteConfig([
  {path: '/first_child', component: FirstChildCmp, name: 'FirstChild', useAsDefault:true},
  {path: '/second_child',component: SecondChildCmp, name:'SecondChild'}
])
export class ParentCmp{}

bootstrap(ParentCmp,[
  ROUTER_PROVIDERS
]);

anak_pertama.ts

import {Component} from 'angular2/core';
import {ROUTER_DIRECTIVES} from 'angular2/router';

@Component({
  selector: 'child',
  template: `
  <a [routerLink]="[SecondChild]">Go to second child</a>
  `,
  directives: [ROUTER_DIRECTIVES]
})
export class FirstChildCmp{}

anak_kedua.ts

import {Component} from 'angular2/core';

@Component({
  selector: 'child',
  template: `
  This is second child.
  `
})
export class SecondChildCmp{}

Ketika pengguna mengklik Go to second child saya ingin menampilkan template komponen anak kedua. Tapi saya mendapatkan kesalahan berikut:

Komponen "FirstChildCmp" tidak memiliki konfigurasi rute.

Tapi saya tidak ingin mendefinisikan konfigurasi di FirstChildCmp melainkan saya ingin menggunakan konfigurasi orang tua. Saya telah membuat ulang masalah tersebut di plunker di sini


person Eesa    schedule 27.04.2016    source sumber


Jawaban (1)


FirstChild.ts Plnkr

@Component({
  selector: 'child',
  template: `
  <a [routerLink]="['SecondChild']">Go to second child</a>
  `,
  directives: [ROUTER_DIRECTIVES]
})
export class FirstChildCmp{}

Di ['SecondChild'] Anda melewatkan kutipan. Itu harus berupa string.

person Ankit Singh    schedule 27.04.2016