从 Aurelia 中的子组件（constroller/viewmodel）访问路由器对象

Question

我是 Aurelia 的新手（但在 Angular 中是老手），并试图在我的第一个应用程序中实现路由配置。我在 app.js 中配置了这样的路由：

configureRouter(config, router) {
    RoutingHelper.exerciseOneRouteConfig(this, config, router);
  }

辅助函数写在一个单独的文件中：

routing_helper.js

import {
  PLATFORM
} from 'aurelia-pal';

export class RoutingHelper {
  static exerciseOneRouteConfig(self, config, router) {
    self.router = router;
    config.title = 'تمرین ۱';
    config.map([{
        route: ['', 'home'],
        name: 'home',
        moduleId: PLATFORM.moduleName('app/index'),
        title: 'خانه',
        nav: true
      },
      {
        route: ['account'],
        name: 'account',
        moduleId: PLATFORM.moduleName('app/account/index'),
        title: 'حساب کاربری',
        nav: true
      },
      {
        route: ['profile'],
        name: 'profile',
        moduleId: PLATFORM.moduleName('app/account/profile/index'),
        title: 'پروفایل کاربر',
        nav: false
      },
      {
        route: ['signup'],
        name: 'signup',
        moduleId: PLATFORM.moduleName('app/account/signup/index'),
        title: 'ثبت نام',
        nav: false
      },
      {
        route: ['signin'],
        name: 'signin',
        moduleId: PLATFORM.moduleName('app/account/signin/index'),
        title: 'ورود کاربر',
        nav: false
      },
      {
        route: ['changepass'],
        name: 'changepass',
        moduleId: PLATFORM.moduleName('app/account/signin/changepass'),
        title: 'تغییر کلمه عبور',
        nav: false
      },
    ]);
  }
}

现在在访问模块中我可以访问路由器对象，在它的 html 我可以进行导航和打印导航模型。

在子组件（其他页面）中使用 html 指令工作正常，但无法从其 js 文件访问路由器对象。例如在 'app/account/signin/index.js' 我想使用这个函数：

this.router.navigateToRoute('profile');

但是这里没有定义路由器。

Answer 1

我想通了。使用 aurelia 的 DI 共享路由器对象。因此，在任何组件中，我都必须首先导入 Router：

...
import {
  Router
} from 'aurelia-router';
...

然后将其注入到组件中：

...
@inject(Router)
...
constructor(router){
  this.router = router;
}
...

最后在组件中的任何地方使用它：

this.router.navigateToRoute('profile');

希望这个回答对其他人也有帮助。 TG.

从 Aurelia 中的子组件（constroller/viewmodel）访问路由器对象

Access router object from child component(constroller/viewmodel) in Aurelia

aurelia