angular 2 es5组件路由

Question

我正在尝试使用ES5实现Angular 2路由。

以下是appComponent

(function(app) { 
    app.AppComponent =function() {}; 
    app.AppComponent = ng.core 
    .Component({ 
     selector: 'my-app' 
    }). 
    View({ 
     templateUrl: 'app.html', 
     directives: [ng.router.ROUTER_DIRECTIVES] 
    }) 
    .Class({ 
     constructor: function() { 
      this.name = "pankaj Badukale"; 
     } 
    }); 

    **ng.router.RouteConfig([ 
     { 
      path: "login", 
      component: app.LoginComponent, 
      as: "login" 
     } 
    ]);** 

})(window.app || (window.app = {})); 

app.html

<h1> 
    {{name}} 
    <a [routerLink]="['/login']">Home</a> 
    <router-outlet></router-outlet> 
</h1> 

我想知道我们如何能够配置在组件路由。

我已经搜索很多，但人们只是定义了查看，组件，类。

有没有人有想法？

Answer 1

组件和RouteConfig都是装饰，你可以写在角2（测试版）装饰像

app.AppComponent = ng.core.Component(...)(app.AppComponent); 
app.AppComponent = ng.router.RouteConfig(...)(app.AppComponent); 

这里是你的工作副本...

(function(app) { 
    app.AppComponent =function() {}; 
    app.AppComponent = ng.core 
    .Component({ 
     selector: 'my-app' 
    }). 
    View({ 
     templateUrl: 'app.html', 
     directives: [ng.router.ROUTER_DIRECTIVES] 
    }) 
    .Class({ 
     constructor: function() { 
      this.name = "pankaj Badukale"; 
     } 
    }); 

    app.AppComponent = ng.router.RouteConfig([ 
     { 
      path: "login", 
      component: app.LoginComponent, 
      as: "login" 
     } 
    ])(app.AppComponent); 

})(window.app || (window.app = {}));