您如何维护页面状态，以便您可以使用 emberjs 提供永久链接? [英] How do you maintain the page state, so that you can provide permalinks using emberjs?

问题描述

我无法很好地了解您如何支持永久链接.这可能仅仅是因为 emberjs 不支持永久链接.

I can't to get a good idea of how you support permalinks. This is perhaps simply because emberjs doesn't support permalinks.

我正在构建一个允许用户选择某些报告的 UI，因此在 ember 中这很容易，您只需添加一个包含 id 的路由报告"，URL 如下所示:

I'm building a UI that allows users to choose certain reports, so in ember this is easy enough you just add a route 'reports' that takes in an id so the URL looks like this:

#/reports/10/

我需要的是一些额外的参数也存在于该 URL 中，例如开始和结束日期以及指标类型，例如

What I need to have is some extra parameters to also be present in that URL for example start and end dates and metric types e.g.

#/reports/10/metric/impressions/start/10-08-2013/end/11-08-2013

因此，如果我将这些参数粘贴到浏览器中，则需要获取这些参数，而且重要的是当用户更改这些设置时，例如应通过日期选择器更新 URL 以反映新参数.

So those parameters need to be picked up if I paste them in the browser, AND importantly when the user changes those settings e.g. via a date picker the URL should update to reflect the new parameters.

这是 jsbin 的链接，其中包含基于以下答案的解决方案.http://jsbin.com/ucanam/703

Here is a link to a jsbin with a solution based on the answer below. http://jsbin.com/ucanam/703

推荐答案

就在这个话题上投入我的 2 美分.请注意，我在生产中使用这种方法并且它工作正常.其实这个问题有两部分.

Just throwing my 2 cents into this topic. Please note that i am using this approach in production and it works fine. Actually there are 2 parts to this question.

1.我怎样才能有多个动态细分?

Mike Grasotti 使用嵌套资源描述了一种方法.这种方法有效，但我认为这种方法在这种情况下有点麻烦.

One approach is described by Mike Grasotti using nested resources. This approach works but i think this approach is a little bit cumbersome in this case.

为什么我觉得它很麻烦?

路由是一种在 Ember 中分离关注点的方法.在这种情况下，我没有看到单独的问题.在我看来，您正在尝试镜像 URL 中表单的状态.我认为它应该是负责关注表单状态"的一条路线.因此，我建议查看以下帖子，其中我描述了如何为每个路由实现多个动态参数:资源嵌套是启用多个动态段的唯一方法吗?

Routes are a means to separate concerns in Ember. In this case i do not see separate concerns. It looks to me like you are trying to mirror the state of a form in your URL. I think it should be one route that is responsible for the concern "state of the form". Therefore i recommend to have a look at the following post, in which i describe how to implement multiple dynamic parameters per Route: Is resource nesting the only way to enable multiple dynamic segments?

2.当您只更改表单中的一个参数时，如何触发序列化挂钩来更新 URL?

问题是 serialize hook 仅在使用新模型输入 Route 时触发.我猜你有一些逻辑，处理改变参数 start 或 end 的事件.我想在这种情况下您不会重新进入路线.那么在这种情况下如何再次触发序列化钩子来更新 URL?我正在我的路由器中处理这样的事件，我正在使用以下代码:

The problem is that the serialize hook is only triggered, when the Route gets entered with a new model. I guess you have some logic in place, that deals with the event of changing the parameters start or end. I suppose that you do not re enter the Route in this case. So how do you trigger the serialize hook in this case again to update the URL? I am handling a event like this in my router and there i am using the following code:

var currentRouteName = this.controllerFor("application").get("currentPath");//the ApplicationController stores the name of the current Route
var url = App.Router.router.generate(currentRouteName);
App.Router.router.updateURL(url);

PS:你可以看看我的制作应用 此处.这个应用程序展示了德国电影院最好的电影.即使您不会德语，也可以单击顶部区域中的控件之一，查看 URL 是否得到更新.我想这与您想要的几乎相同吗?

PS: You can have a look at my production app here. This app shows the best movies in cinemas in Germany. Even if you do not know german, you can click on one of the controls in the top area and see the URL getting updated. I guess this is pretty much the same you want?

这篇关于您如何维护页面状态，以便您可以使用 emberjs 提供永久链接?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！