2016-04-19 9 views
1

Ich fand viele Antworten, die [routerLink] für die Navigation zu Child-Komponenten verwendet, aber nicht " this._router.navigate ([ 'Ergebnis'])“Was ist die korrekte Syntax zum Navigieren zu einer untergeordneten Route mit "this._router.navigate (['Results'])"

hier ist mein Code, app.component.ts

import {Component} from 'angular2/core';  
import {Router, RouteConfig, ROUTER_DIRECTIVES, RouterOutlet} from 'angular2/router'; 
import {SearchComponent} from './search/search' 
import {AttractionComponent} from './attraction/attraction' 
import {ProfileComponent} from './profile/profile' 

@Component({ 
    selector: 'interest-app', 
    templateUrl: 'views/home.html', 
    directives: [ROUTER_DIRECTIVES, RouterOutlet] 
}) 


@RouteConfig([ 
{ 
    path: '/search/...', 
    name: 'SearchHotel', 
    component: SearchComponent, 
    useAsDefault: true 

search.ts

import {Component} from 'angular2/core'; 
import {Router,RouteConfig,ROUTER_DIRECTIVES} from 'angular2/router'; 
import {ResultsComponent} from '../results/results'; 

@Component({ 
    templateUrl: 'views/search.html', 
    directives: [ROUTER_DIRECTIVES] 
}) 

@RouteConfig([ 
{ 
    path: '/results/...', 
    name: 'Results', 
    component: ResultsComponent, 
    useAsDefault: true 

} ]) 
export class SearchComponent { 

    constructor(private _router: Router) { 
    console.log('Child component',_router); 
    } 

    private viewresult() { 
    this._router.navigate(['Results']); 
    } 
} 

seine Arbeit gut, wenn ich verwende useAsDefault: true, aber wenn ich den „Viewresult()“ Anruf bekam ich diesen Fehler

ORIGINAL EXCEPTION: Link "["Results"]" does not resolve to a terminal instruction 

Ich mag wissen, So ist es möglich, den Weg zu Kind Komponenten this.route.navigate statt [routerLink] .Wenn ich möchte die richtige Syntax wissen.

results.ts

import {Component} from 'angular2/core'; 
import {Router,RouteConfig,ROUTER_DIRECTIVES} from 'angular2/router'; 
import {HotelComponent} from '../hotel/hotel'; 

@Component({ 
templateUrl: 'views/results.html', 
directives: [ROUTER_DIRECTIVES]}) 

@RouteConfig([ 
{ 
    path: '/hotel', 
    name: 'Hotel', 
    component: HotelComponent   
}  
]) 

export class ResultsComponent { 

constructor(private _router:Router) 
{ 

} 

private viewhotel() 
{ 
    this._router.navigate(['Hotel']); 
} } 
+1

Bitte fügen Sie die Routen, die Sie auf den 'ResultsComponent' auf Ihre Frage haben. –

+0

Ich habe die ResultsComponent hinzugefügt, die Sache ist, ich möchte auf die verschachtelte Route gehen, wenn ich auf eine Schaltfläche mit der Methode "viewresult()" klicke –

Antwort

1

  • Sie entweder /... von

    Pfad entfernen müssen: '/ Ergebnis/...',

zu

path: '/results', 

  • useAsDefault:true in ResultsComponent
  • zu einer Route hinzufügen
@RouteConfig([{ 
    path: '/hotel', 
    name: 'Hotel', 
    component: HotelComponent, 
    useAsDefault: true   
}]) 
  • oder Ihre navigate Befehl ändern
this._router.navigate(['Results', 'Hotel']); 
+0

Vielen Dank, du hast meinen Tag gerettet, es wäre besser, wenn du es erklären könntest In Kürze, was hier passiert ist, ich wäre sehr dankbar –

Verwandte Themen