Ne angular2 soutien imbriqués les états/routes?

Ne angular2 soutien imbriqués les états/routes?
par exemple, dans une vue de port il y a 2 liens et en cliquant sur un lien spécifique, il présentera un point de vue qui avec, en outre, avoir plus d'un lien, mais qui sont spécifiques à plus tôt lien.

InformationsquelleAutor Suresh Reddy Guntaka | 2016-01-24
  1. 25

    Oui.

    J'ai fait une démo:
    http://plnkr.co/edit/IcnEzZ0WtiaY5Bpqrq2Y?p=preview

    import {Component, View, Input} from 'angular2/core';
import {
    RouteConfig, Router, RouteParams, ROUTER_DIRECTIVES
} from 'angular2/router';
import {PersistentRouterOutlet} from './persistent-router-outlet';


@Component({})
@View({
  template: 'product info here'
})
class ProductInfo {
}

@Component({})
@View({
  template: 'buy here'
})
class ProductBuy {
}


@Component({})
@View({
  directives: [...ROUTER_DIRECTIVES, PersistentRouterOutlet],
  template: `
    <div>
      <h2>Product {{pid}}</h2>
      <a [routerLink]="['Info']">Show Info</a>
      <a [routerLink]="['Buy']">Go Buy</a>
      <div>
        <router-outlet></router-outlet>
      </div>
    </div>
  `
})
@RouteConfig([
  {path: '/info', name: 'Info', component: ProductInfo, useAsDefault: true}
  {path: '/buy', name: 'Buy', component: ProductBuy}
])
class Product {
  pid
  constructor(params: RouteParams) {
    this.pid = params.get('pid')
  }
}

@Component({})
@View({
  directives: [...ROUTER_DIRECTIVES],
  template: `
    info about the store
  `
})
class StoreInfo {
}


@Component({
  selector: 'my-app',
  providers: [],
  directives: [...ROUTER_DIRECTIVES, PersistentRouterOutlet] ,
  template: `
    <div>
      <a [routerLink]="['./StoreInfo']">See Store Info</a>
      <a [routerLink]="['./Product', {pid:1}]">See Product 1</a>
      <a [routerLink]="['./Product', {pid:2}]">See Product 2</a>
      <div>
        <persistent-router-outlet></persistent-router-outlet>
      </div>
    </div>
  `
})
@RouteConfig([
  {path: '/', name: 'StoreInfo', component: StoreInfo, useAsDefault: true}
  {path: '/product/:pid/...', name: 'Product', component: Product}
])
export class App {
}

    Voici la doc: https://angular.io/docs/ts/latest/guide/router.html#!#enfant-routeur

    Remarque il y a un problème avec la persistance des onglets: Angular2 de Routage: la persistance de la route onglets et de l'enfant routes
    https://github.com/angular/angular/issues/6634

    InformationsquelleAutor Namek
  2. 50

    Avec la nouvelle version du routeur, Si vous souhaitez utiliser imbriqués les routes,
    voici un exemple sur la façon de définir le chemin

    {
    path: 'search',
    component: SearchComponent,
    children: [
        { path: 'results/:id',  component: ResultsComponent },
    ]
}

    et dans votre SearchComponent modèle, ajouter <router-outlet></router-outlet>

    • Le NG2 Routeur API dénonçait plus vite que le lait dans mon frigo.
    • Au cours de la bêta et RC oui, non pas que la version finale est, il doit être stable.
    • Si vous souhaitez avoir plusieurs enfants, dire une barre de navigation et un contenu de la zone?
    • NM Ce qui a aidé... blog.angulaire de l'université.io/...
    • Est-il nécessaire de définir { path: '' } route par défaut, les enfants? Pourquoi, si oui?
    • non, il n'est pas. Je l'ai utilisé pour être en mesure d'avoir les deux voies de recherche et /recherche/:id, sinon vous aurez une erreur sur /de recherche
    • Edit : le { path: '' } fournit un bug dans la nouvelle version du routeur, et il n'est plus nécessaire

    InformationsquelleAutor ThomasP1988