解決承諾不會顯示模板中的數據

我嘗試了幾個版本/嘗試創建並返回RSVP.Promise作爲模板的參數。解決承諾不會顯示模板中的數據

所有的console.log都給出合理的值，所以承諾分辨率爲。問題我有（這也是問題）是如何將解析值返回給我的模板。

這裏是我試過的版本：我測試如同我所有的測試，以便

// in controller.js 
testA: Ember.computed('sessionAccount.account.id', function() { 
    let _this = this; 
    let promise = new Ember.RSVP.Promise(function(resolve, reject) { 
     _this.get('store').findAll('accounts2workgroup').then(function(a2ws) { 
      let workgroups = []; 
      a2ws.forEach(function(a2w){ 
       if(a2w.get('rights')>1) { 
        workgroups.push(a2w.get('workgroup')); 
       } 
      }); 
      console.log(workgroups); 
      _this.set('wgAsAdmin', workgroups); // this works 
      resolve(Ember.A(workgroups)); //=> [Object] in rendered template 
      // return workgroups; // no, not that way 
     }); 
    }); 

    promise.then(function(data) { 
     console.log('did resolve'); 
     console.log(data); 
    }) 

    return promise; 
}).property('sessionAccount.account.id'), 

testB: Ember.computed('sessionAccount.account.id', function() { 
    return new Ember.RSVP.Promise(function(resolve, reject) { 
    let workgroups = Ember.ArrayProxy.create([{'label': 'TestB Label'}]); 
     resolve(workgroups); 

    }); 
}), 

testC: Ember.computed(function() { 
    return this.store.findAll('artists2workgroup').then(function(a2ws) { 
      let workgroups = []; 
      a2ws.forEach(function(a2w){ 
       if(a2w.get('rights')>1) { 
        workgroups.push(a2w.get('workgroup')); 
       } 
      }); 
      console.log(workgroups); 
      return workgroups; //=> [Object] in rendered 
    }); 
}), 

testD: Ember.computed(function() { 
    return this.store.findAll('workgroup'); // this of course works, but that's not what I want... 
}),

在我的模板

：

<h4>TestB</h4> 
{{#each testB as |wg|}} 
     {{wg}}<br> 
     {{wg.label}}<br> 
{{/each}} 
testB: {{testB}}<br> 
testB.length: {{testB.length}}<br>

和所有（但最後TESTD明顯）渲染

TESTB
TESTB：[對象的對象]
testB.length：

，雖然我希望/希望他們表現出

TESTB
< DS.PromiseObject：ember1117 >
BB-促進
TESTB：< DS.PromiseObject ：ember1117 >
testB.length：1

我知道有解決方法（我可以在解決f.e.時設置另一個屬性），但想要以正確的方式做，並學習如何做到這一點。我知道，這些例子沒有太大意義。這只是基本的功能，一旦我運行，它會得到增強。

來源

2017-09-15 Jeff

首先請避免explicit promise construction antipattern！您也不必保存this，因爲您在ember-cli中有箭頭功能。所以，讓我們重寫你的testA：

testA: Ember.computed('sessionAccount.account.id', function() { 
    return this.get('store').findAll('accounts2workgroup').then(a2ws => { 
     return workgroups 
      .filter(a2w => a2w.get('rights') > 1) 
      .map(a2w => a2w.get('workgroup')) 
    }); 
}).property('sessionAccount.account.id'),

現在，這不會使其工作。這裏的問題是，燼模板不能承諾。所以你有三種選擇：

只是不這樣做。通常你可以使用model鉤子來做異步工作。
從模板中使用類似ember-promise-helpers的東西。
不要只是返回一個承諾。

如果你不能做1，我建議去3.爲此，你需要了解PromiseProxyMixin。在ember-data你有兩種實現這個密新的PromiseArray和PromiseObject

所有ember-data方法，如findAll，findRecord，query或異步關係返回PromiseObject/PromiseArray。所以他們都是，promise和常規對象。 promise部分在路由model掛鉤中很有用，而Object/Array部分對計算屬性很有用。所以，去你最簡單的方法，就是你的CP分成兩個：

allWorkgroups: Ember.computed(function() { 
    return this.get('store').findAll('accounts2workgroup'); 
}), 
testA: Ember.computed('sessionAccount.account.id', '[email protected]', '[email protected]', function() { 
    return this.get('allWorkgroups') 
     .filter(a2w => a2w.get('rights') > 1) 
     .map(a2w => a2w.get('workgroup')) 
}).property('sessionAccount.account.id'),

這將工作，因爲第一allWorkgroups將是一個空數組/未解決的承諾，但後來當承諾解決的數組被更新，並且testACP將重新計算。

但是您也可以手動創建一個新的PromiseArray：

testA: Ember.computed('sessionAccount.account.id', '[email protected]', '[email protected]', function() { 
    const promise = this.get('store').findAll('accounts2workgroup').then(a2ws => { 
     return workgroups 
      .filter(a2w => a2w.get('rights') > 1) 
      .map(a2w => a2w.get('workgroup')) 
    }); 

    return DS.PromiseArray.create({promise}); 
}).property('sessionAccount.account.id'),

但是你應該知道，在這兩種情況下，你不會得到任何信息，如果承諾失敗！

來源

2017-09-16 13:18:41 Lux

非常感謝這個全面的答案！我學到了很多東西！（最引人注目的事實是，廟會並不承諾） – Jeff

解決承諾不會顯示模板中的數據

回答

相關問題