引导Angular 2 rc.6 .使用ngUpgrade和路由的混合应用
Bootstrapping an Angular 2 rc.6 hybrid app using ngUpgrade with routing
我有一个与rc一起工作的Angular 1/Angular 2混合应用。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>
时,它不会渲染子路由。如果我只引导我的NG2应用而不使用upgradeAdapter,那么一切都会像预期的那样工作。
我觉得我只缺了一个连接的部分。什么好主意吗?
Angular RC.6和Router RC.2 Update
我升级到rc。6和rc。2版本的路由器上周也出现了同样的问题。当不涉及路由时,升级适配器工作得很好。一旦我拉入路由器出口,那么没有任何渲染,也没有错误。
Angular路由器需要至少一个组件被引导才能被实例化。因为ngUpgrade是从Angular 1端启动的,所以没有Angular 2的启动组件。要解决这个问题,您必须覆盖ApplicationRef
并提供您自己的组件。下面是一个工作的活塞演示如何实现这一点。
http://plnkr.co/edit/Gj8xq0?p =
预览参考:
https://github.com/angular/angular/issues/9870相关文章:
- Emberjs应用程序加载在除Index之外的所有路由上
- 正在使用$location.path(.)路由ng视图
- 在AngularJS应用程序中使用封装指令和路由的推荐方式是什么
- 混合 ui-sref 和 $state.go 在 Angular ui-router 中进行状态转换
- 未激发路由的控制器属性上的观察者
- AngularJS ui路由器html5模式中断路由
- 发送json对象或使用express路由呈现视图
- 使用主干网和rails的静态页面路由
- 如何使用Passport保护路由终结点
- 有没有办法用routerLink/router.navigation附加查询/路由参数
- Nodejs和express路由,如何处理客户端的承诺
- TinyMCE实例在切换角度路由选项时会消失
- 什么'在Express中路由时,应用程序级中间件和路由器级中间件之间的区别是什么
- 混合元素的有角度的ng重复
- 使用Ampersand.js路由模块化应用程序
- VueJS多个混合
- Angular 2路由已弃用:如何检测CanActivate
- 格式化获取请求的路由
- 在node-js路由中发出http请求
- 引导Angular 2 rc.6 .使用ngUpgrade和路由的混合应用