加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 百科 > 正文

ajax – durandal:在ViewModels之间传递数据的最佳方式

发布时间:2020-12-16 02:54:01 所属栏目:百科 来源:网络整理
导读:Durandal:如果可能的话,在Viewmodels之间传递数据(参数)的正确方法是什么(不处理后端). 假设我有2个视图概述和详细信息我希望用户点击列表元素从概述中获取该元素的ID并将其传递给详细信息Viewmodel以便我可以开始使用该ID. 感谢您的帮助 解决方法 提示:您
Durandal:如果可能的话,在Viewmodels之间传递数据(参数)的正确方法是什么(不处理后端).

假设我有2个视图概述和详细信息我希望用户点击列表元素从概述中获取该元素的ID并将其传递给详细信息Viewmodel以便我可以开始使用该ID.

感谢您的帮助

解决方法

提示:您可能想要路由驱动的方法.另一个是为了完整起见.

Viewmodel驱动的方法
一般来说,我会说:创建一个模块,让我们称之为数据,并在两个视图模型中注入数据模块.然后,概述可以在数据模块上设置clickedElementId属性,并且详细信息可以读取属性的值并使用它(您甚至可以使属性可观察,以便在概述更改属性时通知详细信息).当两个视图模型同时处于活动状态时,此方法有效,而我的下一个(首选)解决方案仅在您从一个视图路由到另一个视图时才有效,因此它们永远不会同时处于活动状态.这种“视图模型驱动”方法是我个人用于应用程序中的常见数据的方法(您还可以将应用程序shell视图模型用于这些类型的属性).

路线驱动的方法
鉴于您对情况的描述,似乎是您想要做的事情.定义的路由可以采用(可选)参数.假设您现在有路由’详细信息’,您可以将其更改为’details /:id'(接受id参数,非可选)或’details(/:id)'(接受id参数,可选).

单击列表元素需要一个类似于此的事件处理程序:

overview.onElementClick = function (e) {
    var element = this,// The idea is that you need the clicked element for the next line of code
        koDataForElement = ko.dataFor(element);

    router.navigate('details/' + koDataForElement.id);
}

ko.dataFor是一个很好的淘汰助手,用于获取与传递给它的元素绑定的viewmodel数据,在本例中为list元素.单击时,您需要导航到详细信息,并将单击元素的ID传递给详细信息.上面的代码完成了所有这些.

现在你的详细信息viewmodel的activate函数应如下所示:

details.activate = function (id) {
    // id is the parameter we defined for the route. Now you are free to leverage it inside your second view!
};

编辑:附加提示:您还可以直接从链接触发带有ID的路由.假设你的整个列表元素都包含在一个锚标记中,你可以这样做:

<div data-bind="foreach: myListOfElements">
    <a href="#" data-bind="attr: { href: '#details/' + id }">listElementGoesHere</a>
</div>

祝好运!如果还不清楚请告诉我,

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读