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 
      } 
     }); 
    }  
});