Emberjs异步路由

问题描述

我的问题与和。

我在路线上有动态元素。如果我浏览应用程序，所有的都可以。问题是当我重新加载一个页面或当一个类型的url。在这种情况下，应用程序会输入反序列化功能，并通过其id来加载和对象，但是此加载是异步的。

出现问题 lukemelia说你将需要使您的反序列化方法的结果实现承诺模式。 p>

我尝试它，但总是松散的上下文。我的代码类似于：

 页面：Ember.Route.extend 
 route：'/：alias'
反序列化：（路由器，参数） - > page = App.Page.find（params.alias）
 $ .when（page.get（isLoaded））.done（（） - > console.debug（page.get（alias））返回页面
加载：Em.State.extend 
  

路由器进入加载状态，然后返回没有上下文数据。我想我做错了。可能都是错的。

有人可以帮我吗？有没有例子？

谢谢！

已解决：

 页面：Ember.Route.extend 
 route：'/：id'
 deserialize：（router，params） - > 
 page = App.Page.find（params.id}）
 deferred = $ .Deferred（）
 page.addObserver（isLoaded， - > deferred.resolve（page）） 
 return deferred.promise（）
 serialize：（路由器，页面） - > 
 return {id：page.get（id）} 
 connectOutlets：（路由器，页面） - > 
 router.get（'applicationController'）。connectOutlet 
上下文：页
名称：页
加载：Em.State.extend 
 connectOutlets :(路由器，上下文） - > 
 router.get（'applicationController'）。connectOutlet（context：context，name：loading）
  

当页面加载时，正在加载活动状态，当页面完成加载时，路由器加载页面状态自动。

我希望这可能有助于某人

解决方案

@ leroj7你已经找出了一个可行的解决方案。感谢分享。我已经创建了一个混合，我添加到我需要有这种行为的模型：

  Editor.ModelPromise = {
 init：function（）{
 this._super（）; 
 this._deferred = $ .Deferred（）; 
 this._deferred.promise（this）; 
 this.one（'didLoad'，this，'_resolveModelPromise'）; 
 this.one（'becomeError'，这个，'_rejectModelPromise'）; 
}，
 _resolveModelPromise：function（）{
 this._deferred.resolve（this）; 
}，
 _rejectModelPromise：function（）{
 this._deferred.reject（this）; 
} 
}; 
  

也可在

这样的方法最终将被烘焙成ember数据，虽然它很可能没有jQuery依赖，因为ember数据当前不依赖于jQuery。

My problem is related with the issues #1183 and #1268 of emberjs.

I have dynamic element at routes. All is ok if I navigate throuht application. The problem is when I reload a page or when a type the url. In that case the app enter in the deserialize function and load and object by their id, but this load is asynchronous.

At issue #1268 lukemelia says "you will need to make the result of your deserialize method implement the promises pattern".

I try it but always loose context. My code is similar to:

page: Ember.Route.extend
route: '/:alias'
deserialize: (router, params) -> page=App.Page.find(params.alias)
$.when( page.get("isLoaded") ).done( () -> console.debug(page.get("alias")) return page)
loading: Em.State.extend

The router goes to loading state but then return with no context data. I think i doing something wrong. Possibly all is wrong.

Can anybody help me? Is there and example?

Thanks!

Resolved:

page: Ember.Route.extend
    route: '/:id'
    deserialize: (router, params) ->
        page=App.Page.find(params.id})
        deferred = $.Deferred()
        page.addObserver("isLoaded", -> deferred.resolve(page))
        return deferred.promise()
    serialize: (router, page) ->
        return {id: page.get("id") }
    connectOutlets: (router, page) ->
        router.get('applicationController').connectOutlet
            context: page
            name: "page"
loading: Em.State.extend
    connectOutlets: (router, context) ->
        router.get('applicationController').connectOutlet(context: context, name: "loading")

While page is loading the active state is loading, when page finish loading, router load page state automatically.

I hope this may help somebody

解决方案

@leroj7 you've figured out a workable solution. Thanks for sharing it. I've created a mixin that I add to models that I need to have this behavior:

Editor.ModelPromise = {
  init: function() {
    this._super();
    this._deferred = $.Deferred();
    this._deferred.promise(this);
    this.one('didLoad', this, '_resolveModelPromise');
    this.one('becameError', this, '_rejectModelPromise');
  },
  _resolveModelPromise: function() {
    this._deferred.resolve(this);
  },
  _rejectModelPromise: function() {
     this._deferred.reject(this);
  }
};

Also available at https://gist.github.com/1b54f0956ba10195a3bc

An approach like this will eventually be baked into ember-data, though it will most likely NOT have a jQuery dependence, since ember-data does not currently depend on jQuery.

这篇关于Emberjs异步路由的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！