将DurandalJS中的数据传递给其他视图

时间:2013-05-03 09:42:56

标签: single-page-application durandal

我正在使用SPA webapplication开发DurandalJS,但我不明白。

假设我有page 12。在page 1上有一个模式,可以在database中使用BreezeJS创建一个实体,并返回一个密钥(在数据库中生成)。

我想传递这个获取的密钥,然后转到我的第二页,第2页。我知道当我把它放入网址时我该怎么做

http://localhost:60312/#/page2?orderid=2&repairorder=2

但这不是Durandal的方式,或者是它?用户可以输入他自己的一些后果!

我该如何解决这个问题?

2 个答案:

答案 0 :(得分:8)

我想在非常好的@Joseph Gabriel回答中添加一些东西。在durandal你可以这样做:

router.map( url: 'page2/:orderid/:repairorder',
            name: 'Page2',
            moduleId: 'viewModels/page2');

http://localhost:60312/#/page/2/2

但是,你也可以这样做:

router.map( url: 'page2',
            name: 'Page2',
            moduleId: 'viewModels/page2');

http://localhost:60312/#/page2?orderid=2&repairorder=2

您没有指定您正在使用的所有参数。 Yo可以从活动方法的输入中获取此参数。

var activate = function(context) {
  console.log(context.orderid);
  console.log(context.repairorder);
}

如果您希望用户可以存储网址以重复查询仅在浏览器中进行搜索,则第二种解决方案可能会更加合适。

答案 1 :(得分:5)

据我所知,在Durandal应用程序中在视图模型之间传递参数的唯一无缝方法是使用普通的基于哈希的url参数。
在您的示例中,您可以定义一个带有orderId和repairOrder参数的路由器,然后您的网址将如下所示:http://localhost:60312/#/page/2/2

如果您的数据不是太敏感,这是最佳选择。保持导航参数处于打开状态,并在第二个视图模型中小心处理值。换句话说,设计您的视图模型以便它可以正确处理任何值 - 即使用户直接修改参数值,您的视图模型也应该能够正确处理它。

能够直接设置url参数可能是有利的,但在使用它们之前必须小心确保值的完整性。

但是,如果您需要隐藏参数,则可以使用其他选项:

加密:使用像tea.js这样的加密库,并在将其添加为导航参数值之前对其进行加密。然后,当然,在使用它之前,在第二页上解密它。这允许Durandal的router导航正常工作,同时阻止用户提供自己的值。

如果你真的需要阻止用户输入他们自己的值,并且你可以承担一些额外KB的开销,这是一个很好的方法,只要你只需要传递一些参数。

共享数据模型:使用在两个视图模型之间共享的单例模型。此模型可以根据需要手动required(),并且基本上充当一个或多个视图模型之间共享的应用程序状态的存储库。 这很好用,但它有点像一个大的全局变量 - 如果过度使用会变得混乱。

直接修改VM: (仅适用于单例视图模型) 手动require()第二个视图模型,并在导航到它之前设置其属性。