儿童路线之间的导航

当儿童路线之间导航时，我总是收到路线未找到的错误。我已经尝试了几种解决方案，我总是注入，并且在孩子配置后我总是刷新。但是我仍然无法导航到特定的路线。儿童路线之间的导航

当我尝试从create.ts导航到account_view时，它表示路由名称不存在，当我在create.ts中列出this.router中的所有路由时，它只表示accounts_overview和accounts_create，但不包含子路由accounts_overview。

app.ts

import {inject} from 'aurelia-framework'; 
import {RouterConfiguration, Router} from 'aurelia-router'; 
import {HttpClient} from "aurelia-fetch-client"; 
import {AureliaConfiguration} from "aurelia-configuration"; 
import {Container} from 'aurelia-dependency-injection'; 
import {AuthorizeStep} from 'app/authorize-step'; 

export class App { 
    private router: Router; 

    configureRouter(config: RouterConfiguration, router: Router): void { 
     config.title = 'Optios partners'; 
     config.addAuthorizeStep(AuthorizeStep); 
     config.map([ 
      { route: '', redirect: "login" }, 
      { route: '/accounts', name: 'accounts', moduleId: 'account/view/index', title: 'Accounts', settings: { roles: [ 'partner', 'admin' ] } } 
     ]); 
     this.router = router; 
    } 
}

帐户/视图/ index.ts

import {computedFrom} from 'aurelia-framework'; 
import {RouterConfiguration, Router} from 'aurelia-router'; 

export class Index { 
    router: Router; 
    hasSearchFocus: boolean; 
    search: string = ''; 

    configureRouter(config: RouterConfiguration, router: Router) 
    { 
     config.map([ 
      { route: '/overview', name: 'accounts_overview', moduleId: 'account/view/overview', nav: true }, 
      { route: '/create', name: 'accounts_create', moduleId: 'account/view/create', nav: true } 
     ]); 

     this.router = router; 
     this.router.refreshNavigation(); 
    } 
}

帐户/视图/ overview.ts

import {AccountRepository} from "../repository/account-repository"; 
import {inject, computedFrom} from 'aurelia-framework'; 
import {RouterConfiguration, Router} from 'aurelia-router'; 
import {EventAggregator} from 'aurelia-event-aggregator'; 

@inject(AccountRepository, EventAggregator) 
export class Overview { 
    router: Router; 
    eventAggregator: EventAggregator; 
    accountRepository: AccountRepository; 
    accounts: string[]; 
    previousLetter: string = 'Z'; 

    configureRouter(config: RouterConfiguration, router: Router) 
    { 
     config.map([ 
      { route: ['', '/blank'], name: 'account_blank', moduleId: 'account/view/blank', nav: true }, 
      { route: '/:id', name: 'account_view', moduleId: 'account/view/view', nav: true, href: '0' } 
     ]); 

     this.router = router; 
     this.router.refreshNavigation(); 
    } 
}

帐户/视图/ create.ts

import {inject} from 'aurelia-framework'; 
import {Router} from 'aurelia-router'; 
import {computedFrom} from 'aurelia-framework'; 
import {HttpClient} from 'aurelia-fetch-client'; 
import {AccountRepository} from "../repository/account-repository"; 

@inject(AccountRepository, Router) 
export class Create 
{ 
    router: Router; 
    accountRepository: AccountRepository; 
    name: string; 
    isSubmitted: boolean = false; 

    constructor(accountRepository: AccountRepository, router: Router) 
    { 
     this.accountRepository = accountRepository; 
     this.router   = router; 
    } 

    create() 
    { 
     this.isSubmitted = true; 
     if (this.isValid()) { 
      this.accountRepository 
       .create(this.name) 
       .then(response => { 
        if (! response.ok) { 
         throw Error(response.statusText); 
        } 

        return response.json(); 
       }) 
       .then(response => { 
        console.log(this.router.routes); 
        this.router.navigateToRoute('account_view'); 

        return response; 
       }) 
       .catch(error => { 
        console.error(error); 
       }); 
     } 
    } 
}

来源

2017-02-18 tmas

为什么在路径定义中使用引号斜杠？他们应该没有他们工作很好https://gist.run/?id=11b928907440e90ea6564ec18d4e0f76 –

是的，我不知道它发生了。我无法解决我的问题，但我确实改变了我的工作方式，放弃了孩子的路线，并将所有内容放在单独的“自定义”元素中。这导致我有时重复布局的小部分。 – tmas

您不应该为此使用自定义元素，因为您将失去深度链接。 –

您不能路由到不同的子路由器具名的路线。我们正在讨论如何在未来的Aurelia版本中处理这类问题。

这就是说，我怀疑你永远无法做到你正在试图做的事情，你试图做到这一点。你有一个孩子路由器结构，看起来像这样：

 APP 
     | 
    ACCOUNTS 
    / \ 
    OVERVIEW CREATE

您正在尝试有CREATE路由器路由在OVERVIEW路由器的路由，它没有的知识。国际海事组织，你有一个过度嵌套的路由器结构。我会将路由器结构展平一些，然后考虑使用EventAggregator来发布父路由器的页面将订阅并导致导航事件或事件的事件。

来源

2017-02-19 02:56:15

儿童路线之间的导航

回答

相关问题