【发布时间】:2016-12-26 17:38:56
【问题描述】:
我有一个 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 工作得很好。一旦我拉入路由器插座,就什么都没有渲染,也没有错误。
【问题讨论】:
-
您是否将路由器指令添加到组件的“指令”属性装饰器中?从那里
import {ROUTER_DIRECTIVES} from '@angular/router'; -
@OlegBarinov 我只是试了一下,但仍然没有。我认为路由器指令将在模块级别处理?按照 angular.io 指南,我在 app.routing.ts 中设置路由并利用
RouterModule.forRoot()函数,然后在我的模块的导入中使用该函数。无论哪种方式,直接导入指令似乎都没有帮助。 -
上周我升级到 rc.6,同样的问题。当不涉及路由时,UpgradAdapter 工作得很好。一旦我拉入路由器插座,就什么都没有渲染,也没有错误。
标签: javascript angular angular-routing ng-upgrade