Aurelia Router hook - 提供预先实例化和激活的模块

Question

我想知道路由器中是否有挂钩提供已经实例化的模块？如果我走错了路，那会是更好的方法吗？

考虑这种情况......

• 我的域名中有一个名为Contract的模型。
• 用户可以搜索合同。
• 用户可以在单独的标签页中打开多个不同的合同实例

以下是UI的一部分，显示了在标签中打开多个合同时的外观如何...

在这里，您可以看到一个合约导航级别，其中包含一个“搜索”选项卡（静态且始终打开）以及已由用户 123456 ， 789102 打开的3个合同，和 987654 。

有没有办法可以使用路由器做这样的事情？因此，一旦合同被打开，如果用户切换并切换回来，我可以在初次访问时提供已加载和激活的模块吗？

目前我已经使用一种合约容器VM来解决它，这是一个包装器，加上一种开放式合约模型的缓存。标签本身是根据缓存中的合同构建的，当容器被激活时（通过路由到/ contract /：id），它会通过该id在缓存中搜索合同，如果找到则使用否则加载合同然后显示通过撰写......

我宣称这是here。容器VM看起来像：

import {inject} from 'aurelia-framework';
import {Contracts} from './contracts';

@inject(Contracts)
export class ContractContainer {
  constructor(openContracts) {
    this.id = '';
    this.openContracts = openContracts;
    this.contract = null;
  }

  activate(params) {
    this.id = 'Contract ' + params.id.toString();
    this.contract = this.openContracts.getOrCreateContractByKey(params.id);
  }
}

观点：

<template>
  <compose view-model.bind="contract"/>
</template>

Answer 1

西蒙，

我下载并运行了您的测试项目，试图了解您在这里做了什么，这是我的想法：

“联系人”页面将具有子路由器，子路由器将创建选项卡。当用户选择选项卡时，路由器将导航到项目ID。

在activate事件中，获取id并提取与该合同一起的数据并显示它。数据可以在内存，本地存储或数据库中。

因此，您不要尝试让路由器加载已创建的视图，只需抓住当前的合同实体并将其绑定即可。

对于用户来说，它看起来会像一个不同的标签，但实际上，它是相同的用户界面，只是不同的数据。

绑定到合同实体，而不绑定到viewModel的属性。然后，当您交换实体时，所有先前数据都已存在于实体中。例如bind