Ember模型掛鉤不會等待返回ajax調用的結果

Question

我正在試圖找出這個問題。當我在需要（需要）從存儲中返回ajax調用和數據的結果的模型鉤子內部進行ajax調用時，Ember僅希望從存儲中返回數據，而不是等待阿賈克斯呼籲。下面的代碼：

model: function() { 
     var user = this.modelFor('application').user; 
     var org_id = user.get('org').get('id'); 
     var current_org = this.store.peekRecord('org', org_id); 
     var _this = this; 
     var redAppsRiskTotal = 0; 
     var amberAppsRiskTotal = 0; 
     var greenAppsRiskTotal = 0; 

     ajax({ 
      url: _this.modelFor('application').url + '/orgs/' + org_id + '/apps.json?auth_token=' + user.get('auth'), 
      type: 'get' 
     }).then(function(result) { 

      var greenRisk = current_org.get('greenRiskThreshold'); 
      var redRisk = current_org.get('redRiskThreshold'); 


      result.forEach(function(app) { 

       if (app.total_risk_score < greenRisk) { greenAppsRiskTotal += 1; } else 
       if (app.total_risk_score < redRisk) { amberAppsRiskTotal += 1; } else 
       { redAppsRiskTotal += 1; } 
      }); 

      console.log(current_org.get('businessLineCount')); // these all display the correct result non-zero results 
      console.log(redAppsRiskTotal); 
      console.log(amberAppsRiskTotal); 
      console.log(greenAppsRiskTotal); 
     }); 

     return { current_org, redAppsTotal: redAppsRiskTotal, // but this only returns the current_org 
                amberAppsTotal: amberAppsRiskTotal, // the others are zero 
                greenAppsTotal: greenAppsRiskTotal }; 
    } 

我完全知道我做錯了異步，而且它可能非常基本的，我只是無法弄清楚。我在Ember相對較新。我嘗試了各種各樣的方法 - 給ajax調用添加第二個'.then'，從ajax調用創建一個函數，調用它，然後添加一個'.then'，將我的return語句放在然後塊等等等等等等。沒有什麼可行的（所有這些解決方案導致沒有數據返回）。請幫忙！謝謝。

Answer 1

基本上你只需要返回一個承諾。一個很好的修復程序，你會使用RSVP.hash：

return Ember.RSVP.hash({ // hash waits for all promises and returns an object with the results. 
    ajaxData: ajax(...), // assume that ajax returns a promise 
    emberDataObj1: this.store.find(...), // another promise 
}); 

Answer 2

model鉤將等待承諾得到解決。你應該返回Promise或Ajax調用

import Ember from 'ember'; 
const { RSVP } = Ember; 

export default Ember.Route.extend({ 
    model: function() { 
     var user = this.modelFor('application').user; 
     var org_id = user.get('org').get('id'); 
     var current_org = this.store.peekRecord('org', org_id);   
     var redAppsRiskTotal = 0; 
     var amberAppsRiskTotal = 0; 
     var greenAppsRiskTotal = 0;   
     return RSVP.resolve($.get(this.modelFor('application').url + '/orgs/' + org_id + '/apps.json?auth_token=' + user.get('auth'))).then((result) => { 
      var greenRisk = current_org.get('greenRiskThreshold'); 
      var redRisk = current_org.get('redRiskThreshold'); 
      result.forEach(function(app) { 
       if (app.total_risk_score < greenRisk) { greenAppsRiskTotal += 1; } 
       else if (app.total_risk_score < redRisk) { amberAppsRiskTotal += 1; } 
       else { redAppsRiskTotal += 1; } 
      });    
      return { 
       'current_org': current_org, 
       'redAppsTotal': redAppsRiskTotal, // but this only returns the current_org 
       'amberAppsTotal': amberAppsRiskTotal, // the others are zero 
       'greenAppsTotal': greenAppsRiskTotal 
      } 
     }); 
    }  
});