使用ngUpgrade和路由引导一个Angular 2 rc.6混合应用程序
我有一个Angular 1 / Angular 2混合应用程序,它与rc.3和弃用的路由器一起工作。 从我能找到的所有资源中,rc.5是迈向新路由器迈出的重要一步。 我能够引导我的混合应用程序并呈现我的根组件,但路由不起作用。
var upgradeAdapter = new UpgradeAdapter(forwardRef(() => AppModule));
angular.module('ng1App', [])
.directive('myBaseComponent', <any>upgradeAdapter.downgradeNg2Component(MyBaseComponent));
@NgModule({
imports: [BrowserModule, routing],
providers: [appRoutingProviders, HTTP_PROVIDERS],
declarations: [MyBaseComponent,
MyNG2RoutableComponent]
})
class AppModule { }
upgradeAdapter.bootstrap(document.body, ['ng1App']).ready(function(){
console.log('bootstraped!');
});
我的根NG2组件引导,因为我可以扔东西在它呈现的模板。 但是,当我添加<router-outlet></router-outlet>
它似乎不会呈现子路由。 如果我没有upgradeAdapter引导我的NG2应用程序,一切都按预期工作。
我觉得我缺少一个连接件。 有任何想法吗?
Angular RC.6和路由器RC.2更新
我上周升级到了rc.6和rc.2版本的路由器,同样的问题。 UpgradAdapter在不涉及路由时效果很好。 一旦我拉入路由器插座,就没有渲染,也没有错误。
角路由器需要至少一个组件被引导以实例化。 由于ngUpgrade引导了Angular 1方面,因此不存在Angular 2引导组件。 要解决此问题,您必须重写ApplicationRef
并提供您自己的组件。 展示如何实现这一目标,这是一个有用的运动员。
http://plnkr.co/edit/Gj8xq0?p=preview
以供参考:
https://github.com/angular/angular/issues/9870
链接地址: http://www.djcxy.com/p/35731.html上一篇: Bootstrapping an Angular 2 rc.6 hybrid app using ngUpgrade with routing