Angular2 Вложенная маршрутизация от родительского к дочернему ES5 не работает

Question

Текущая работа над бета-версией angular2 6 в этой вложенной маршрутизации, например, с использованием родительского для дочернего (EX:/plan/...) будущего, не работает над разработкой JavaScript es5, но в тип сценария разработки отлично работает

Ошибка выброса: ИСКЛЮЧЕНИЕ: Ссылка «[" План "]" не разрешает инструкцию терминала.

App.js код

var Tabs = [],viewId; 

app.AppComponent = 
    ng.core.Component({ 
     selector: 'app', 
     template: '<router-outlet></router-outlet>', 
     directives: [ng.router.ROUTER_DIRECTIVES], 
     providers: [ng.http.HTTP_PROVIDERS] 
    }) 

    .Class({ 

     constructor: [ng.router.Router, function(router) { 
      console.log("1"); 
      router.config([ 
       { path: '/', redirectTo: ['Home'] }, 
       { path: '/home', component: app.HomeComponent, name: 'Home' }, 
       { path: '/plan/...', component: app.planComponent, name: 'Plan' } 
      ]); 
     }] 
    }); 

document.addEventListener('DOMContentLoaded', function() { 
    ng.platform.browser.bootstrap(app.AppComponent,[ng.router.ROUTER_PROVIDERS]); 
}); 

Plan.js код

app.planComponent = 
    ng.core.Component({ 
     selector: 'plan-view', 
     templateUrl: './assets/src/plan/view/plan.html', 
     directives: [ ng.router.RouterLink, ng.router.ROUTER_DIRECTIVES], 
    }) 
    .Class({ 
     constructor:[ng.router.Router, function(router){ 
      console.log("2"); 
      router.config([ 
       { path: '/', redirectTo: ['PlanInfo'] }, 
       { path: '/planInfo', component: app.planInfoComponent, name: 'PlanInfo', useAsDefault: true }/*, 
       { path: '/coverage', component: app.CoverageComponent, name: 'Coverage' }, 
       { path: '/nonelective', component: app.nonElectiveComponent, name: 'NonElective' }, 
       { path: '/loans', component: app.loansComponent, name: 'Loans' }, 
       { path: '/enrollment', component: app.enrollmentComponent, name: 'Enrollment' }*/ 
      ]); 
     }] 
    }); 

Answer 1

Я думаю, что вы должны использовать ng.router.RouteConfig декоратор вместо самого маршрутизатора. Таким образом, вы будете иметь ту же конфигурацию, что и с TypeScript.

Вот способ сделать:

ng.router 
    .RouteConfig([ 
     { path: '/', redirectTo: ['Home'] }, 
     { path: '/home', component: app.HomeComponent, name: 'Home' }, 
     { path: '/plan/...', component: app.planComponent, name: 'Plan' } 
    ])(app.AppComponent); 

(...) 

ng.router 
    .RouteConfig([ 
     { path: '/', redirectTo: ['PlanInfo'] }, 
     { path: '/planInfo', component: app.planInfoComponent, name: 'PlanInfo', useAsDefault: true }/*, 
     { path: '/coverage', component: app.CoverageComponent, name: 'Coverage' }, 
     { path: '/nonelective', component: app.nonElectiveComponent, name: 'NonElective' }, 
     { path: '/loans', component: app.loansComponent, name: 'Loans' }, 
     { path: '/enrollment', component: app.enrollmentComponent, name: 'Enrollment' }*/ 
    ])(app.planComponent); 

В качестве эталона, вы могли бы посмотреть на этот plunkr: https://plnkr.co/edit/w61Ecbmuj7EfDnsYEHOS?p=info.