Ember.js peekAll不觸發foo.loading

我遇到了一個問題，我在使用peekAll()在我的路由模型（）中加載大量記錄。我有一些視圖渲染簡化，因爲頁面渲染當前需要2500毫秒，但它突出顯示foo.loading狀態似乎沒有被觸發，因爲當單擊新鏈接時頁面模板掛在現有鏈接上2500毫秒沒有加載顯示。如何手動控制route.js文件中的foo.loading狀態，以便加載模板呈現？Ember.js peekAll不觸發foo.loading

我有我的route.js下面的代碼文件目前正在使用schedule設置isRendering控制器上：

model(params, transition) { 
    const passedInOrgCode = transition.params.customers.org_code; 
    const orgCode = passedInOrgCode !== undefined ? passedInOrgCode : this.get('currentUser.org.orgCode'); 

    if (orgCode !== this.get('currentUser.impersonatedOrg.orgCode')) { 
     this.store.queryRecord('organisation', { org: orgCode }).then(org => { 
     this.get('currentUser').impersonateOrg(org); 
    } 

    const peekData = this.store.peekAll('customer'); 

    let filterByOrg = (customers) => { 
     return customers.filter((item) => { 
     if (item.get('parentOrgCode') === orgCode || parseInt(orgCode) === ENV.APP.KORDIA_ORG_CODE) { 
      return true; 
     } 
     }); 
    }; 

    if (peekData.get('content').length === 0) { 
     return new Ember.RSVP.Promise((resolve, reject) => { 
     this.store.query('customer', { orgCode: orgCode }).then((customers) => { 
      resolve(filterByOrg(customers)); 
     }).catch(() => { reject(); }); 
     }); 
    } else { 
     Ember.run(() => { 
     this.controllerFor('customers.index').set('isRendering', true); 
     return filterByOrg(peekData); 
     }); 
     Ember.run.schedule('afterRender',() => { 
     this.controllerFor('customers.index').set('isRendering', false); 
     }); 
    } 

    },

在我的車把文件：

{{#if isRendering}} 
    {{loading-component }} 
    {{else}} 
    {{customer-list customers=model updated=updated search=search orgCode=orgCode}} 
{{/if}}

所有的狀態在正確的時間觸發到控制檯，但是我無法使視圖呈現加載狀態。

來源

2017-04-11 Ezra

[解決]

我不得不換一個RSVP承諾對象我peekAll與Ember.run.later功能。答案在異步路由文檔 - https://guides.emberjs.com/v2.12.0/routing/asynchronous-routing/#toc_the-router-pauses-for-promises。相關的一段代碼如下：

if (peekData.get('content').length === 0) { 
    return new Ember.RSVP.Promise((resolve, reject) => { 
    this.store.query('customer', { orgCode: orgCode }).then((customers) => { 
     resolve(filterByOrg(customers)); 
    }).catch(() => { reject(); }); 
    }); 
} else { 
    return new Ember.RSVP.Promise(function(resolve) { 
    Ember.run.later(function() { 
     resolve(filterByOrg(peekData)); 
    }); 
    }); 
}

希望這可以幫助別人:)

來源

2017-04-11 03:32:17 Ezra

Ember.js peekAll不觸發foo.loading

回答

相關問題