Aurelia,在route-href之前调用click函数

Aurelia, call click function before route-href

我有一个看似简单的问题想要解决,但对于我来说,我无法让它工作。 我有一个函数 setStatus(),我想在路由到另一个页面之前调用它。

test1.js

export class Test1{

  setStatus() {
    this.statusId = 1
  }
}

test1.hmtl

<template>
  <a route-href="route:test2" click.delegate="setStatus()">  <!-- search-href="model.bind: searchModel"> -->
    <h3 class="tsd-dashboard-block__title">${'overdue' & t}</h3>
    <span class="tsd-dashboard-block__count">${count}</span>
  </a>
</template>

问题是它直接路由到 test2 而不会调用 test1 中的 setStatus() 函数。

我也尝试过使用 click.trigger 但没有。 谁能指出我在这里做错了什么,或者我需要使用一些特殊的 aurelia 路由事件吗?谢谢

P.S我也跟着这个例子link

<a route-href="route:test2" click.delegate="setStatus()">

我认为你缺少一个“

如果您需要在按下锚点之前调用一个函数,您可以在 mousedown 上执行此操作,这样它会比在处理程序之前调用的点击处理程序更早被触发。 mousedown.trigger="myMethod()" 之类的东西应该可以工作。确保从 myMethod() 设置为 return true,否则它不会按预期导航。

我从来没有混合过这样的事件,但我已经通过以编程方式使用路由器解决了类似的问题。

基本上你可以在你的 setStatus()

setStatus() {
  this.statusId = 0;
  this.router.navigateToRoute('route:test2');
}

要完成这项工作,您需要在构造函数中注入路由器。

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

  ...
  setStatus() { ... }
  ...

}

编辑:我建议将 setStatus 方法重命名为更明确的名称:)

Edit2:正如@PW Kad 所提到的,就用户体验而言,这不应该是 link。这更像是一个带有导航副作用的动作,<button> 将是 HTML 元素的更好选择。