Ember.js-如何使用Ember.Router实现所选项目

Ember.js - How to implement selected item using Ember.Router?

本文关键字：Ember 选项 项目 实现 Router js- 何使用      更新时间：2023-09-26

我想知道当用户单击/选择其中一个项目时，处理项目列表并显示项目详细信息的最佳方法是什么。例如，当用户单击其中一条消息时，在左侧边栏中显示电子邮件列表，并在主内容区域中显示消息详细信息。

使用@pangrantz关于如何使用路由器基础设施标记活动菜单项的好答案，我能够想出一个工作示例：jsFiddle

但有几件事似乎不太对劲：

首先，在路由器的show状态下的#connectOutlets中，我在控制器上设置所选消息，并将插座与同一对象连接。我想我可以做其中一个。

connectOutlets: function(router, context) {
    router.set('messagesController.selected', context);
    router.get('applicationController').connectOutlet('message-details', 'messageDetails', context);
}

其次，我正在从index和show状态转换到相同的状态。我甚至不确定我是否想过渡到一个新的状态——我只想接通插座。

showDetails: Ember.Route.transitionTo('show')

有什么可以修改的地方可以让这个代码更地道吗？谢谢

在我看来，这段代码非常地道。你是对的，你不需要设置所选的消息。当您连接消息详细信息插座时，它会将所选消息设置为消息详细信息控制器上的内容。

您应该将IMO从索引转换为显示状态，因为这是一种很好的RESTful实践，也允许用户为单个消息添加书签。我会将索引状态的URL设置为"/messages"，而不是"/"。

相关文章：