Question

Durandal：如果可能的话，在Viewmodels之间传递数据（参数）的正确方法是什么（不处理后端）。

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

感谢您的帮助

Answer 1

提示：您可能想要路线驱动的方法。另一个是为了完整起见。

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>

祝你好运！如果还不清楚，请告诉我，

durandal：在ViewModels之间传递数据的最佳方式

1 个答案: