如何访问Aurelia的儿童路由器？

Question

我有两个子路由器。 我可以从一个导航到另一个。 但是从子路由器视图中，我该如何导航？

下面的代码行给出了父路由器实例。

import {Router} from 'aurelia-router'

如何获取子路由器实例？

Answer 1

要创建子路由器，请在子路由上创建新路由器，方法与在父路由上创建路由器的方式相同。 然后，将路由器设置为视图模型类的属性，以便您可以在整个视图模型中访问它。

import { Router } from 'aurelia-router';

class ChildViewModel() {  
    configureRouter(config, router) {
        this.router = router;
        // router config
    }
    someOtherFunction() {
        this.router.navigate('somewhere');
    }
}

如果您希望在另一个视图模型中使用子路由器，则可以导入它并在类上使用路由器（假设该类是单例，除非您另外配置，否则应该是该单元）。

import { inject } from 'aurelia-framework';
import { ChildViewModel } from './child-view-model';

@inject(ChildViewModel)
class AnotherViewModel() {
    constructor(cvm) {
        this.externalRouter = cvm.router;
    }
    doStuff() {
        this.externalRouter.navigate('somewhere');
    }
    doOtherStuff() {
        ChildViewModel.router.navigate('somewhere else');
    }
}

Answer 2

我的朋友帮我解决了这个问题。 对于第一个路由器导航中的子路由器，我有空白''并且它使用了类似localhost：9000 /的URL。 当我尝试从那里导航时，我遇到了问题。 所以从第一个导航，我改为代码路由像childrouter / name一样工作。