Question

Aurelia Router触发了EventAggregator中我可以订阅的事件。我的代码订阅了router:navigation:processing事件，因此，每当用户单击一条路线时，我的导航菜单都会关闭。

eventAggregator.subscribe('router:navigation:processing', e => menu.close());

问题在于，当用户在他们要导航到的页面上时，菜单保持打开状态。当他们选择当前所在页面时，我想关闭菜单。

我还要提及我的菜单链接如下：

<a route-href="route:showcase" class="menu-item">Showcase</a>

我想尽可能保持链接不变，因为我喜欢aurelia-router如何自动绑定href地址。

Answer 1

否，对此没有真正的内置机制。 history-browser负责拦截锚标记上的点击事件，并将url片段发送到routeHandler。

仅当新片段与旧片段不同时才执行此操作（如果navigationStategy为'replace'，则为或）；如果没有，则该操作将在涉及路由器之前就中止。

根据需要的频率以及值得投资的时间等，会想到一些选择：

在锚标记上添加一个click.trigger事件侦听器。点击后，您的支票在注入的BrowserHistory：history._getFragment(DefaultLinkHandler.getEventInfo(event).href) === history.fragment上会有点小（它模仿了框架的功能）。如果结果为true，则说明您位于同一页面上，并且路由器将不执行任何操作，因此，现在是将内容发布到EventAggregator的时候了。
或更简单（但更容易出现问题/边缘情况）的替代方法：注册一个单击事件，该事件将href属性与window.location.href或其某些朋友进行简单比较。
使用navigationStrategy.replace（不建议使用，因为它会无故重做整个组件，但这是一个选择）
覆盖BrowserHistory类的navigate()方法，该方法在this.fragment === fragment全局发布时发布到EventAggregator（第138行或index.js之类），并在DI中进行注册为History

Answer 2

我将弗雷德·克鲁弗（Fred Kleuver）的答案标记为答案，因为我觉得他的方法虽然更难实施，但可能更强大。但是，您还需要了解框架的内部运作方式。最后，我只是实现了一种解决问题的简单方法。我创建了一个名为navigate-to-page-link的自定义元素。

navigate-to-page-link.ts

import { bindable, autoinject } from 'aurelia-framework';
import { Store } from 'aurelia-store';
import { State } from '@src/state/state';
import { MenuStateActions } from '../menu-state';

@autoinject()
export class NavigateToPageLink{
  @bindable route: string;
  @bindable name: string;

  constructor(private store: Store<State>){}

  closeMenu(){
    this.store.dispatch(MenuStateActions.close);
    return true;
  }
}

navigate-to-page-link.html

<template>
  <a route-href="route.bind: route" click.delegate="closeMenu()" class="menu-item">${name}</a>
</template>

因此，基本上，我使用aurelia-store打开和关闭菜单。另外，我需要通过return true方法中的click.delegate来导航href链接。

在菜单中，我像这样使用此元素：

<require from="./navigate-to-page-link"></require>
<navigate-to-page-link route="home" name="Home"></navigate-to-page-link>

在Aurelia Router中，当用户尝试导航到同一页面时能否得到通知？

2 个答案: