是否angular2支持嵌套国家/路线？ [英] Does angular2 support nested states/routes?

问题描述

是否angular2支持嵌套国家/路线？
例如在视口中有2个链接和点击一个特定链接，将present视图这进一步有多个链接，但特定于前面的链接。

Does angular2 support nested states/routes? for example in a view port there are 2 links and on clicking a specific link it will present a view which with further have more than one link but that are specific to earlier link.

推荐答案

是

我做了一些演示：
http://plnkr.co/edit/IcnEzZ0WtiaY5Bpqrq2Y?p=$p$pview

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 {
}

这里的DOC： https：//开头的角度。 IO /文档/ TS /最新/引导/ router.html＃！＃儿童路由器

请注意有持续性选项卡的问题：<一href=\"http://stackoverflow.com/questions/34925782/angular2-routing-persisting-route-tabs-and-child-routes\">Angular2路线：路线坚持选项卡和子路由
  https://github.com/angular/angular/issues/6634

Note there's a problem with persistent tabs: Angular2 Routing: persisting route tabs and child routes https://github.com/angular/angular/issues/6634

这篇关于是否angular2支持嵌套国家/路线？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！