在 Angular 降级组件中访问 $stateParams

Question

我目前正在开发一个混合项目 Angular/AngularJS，我们正在使用 Angular 的downgradeComponent ，它运行得非常好。

除了相当容易的动态之外，有时我们会遇到一些障碍。 有这个页面使用 url 参数来实现一些功能，在 AngularJS 中运行良好，但现在，路由到新的 Angular 版本根本不起作用，

之前的路由 state，指向旧页面看起来是这样的：

.state('userEdit', {
    title: 'routes_userEdit',
    url: '/user/:id',
    template: require('html-loader!./user/userEdit.html').default,
    controller: 'UserEditController'
})

这样，可以在UserEditCntroller.js上使用$stateParams.id轻松访问id参数

但是现在，有了新的 Angular 组件，它看起来像这样

.state('userEdit', {
    title: 'routes_userEdit',
    url: '/user/:id',
    template: `<ng2-user-edit></ng2-user-edit>`
})

它与前面的代码类似，但模板是 Angular 组件，它无法访问 AngularJS 的$stateParams 。

我的问题是.. 如何在 Angular2+ 降级组件中访问$stateParams ？ 我已经尝试过使用 Angular 的ActivatedRoute组件，但它返回一个空的参数数组。

Answer 1

如果 Angularjs 规则路由，你可以像往常一样访问$stateParams ng1 服务：

providers: [
    {provide: '$stateParams', useFactory: (i: any) => i.get('$stateParams'), deps ['$injector']}
]

在组件@Inject('$stateParams') $stateParams