I have been experimenting with various approaches to create and return a RSVP.Promise as a parameter for my template.
All console.log outputs reasonable values, indicating that the promises are indeed resolving. The issue I am facing (which then becomes the question) is how to effectively pass these resolved values to my template.
Below are the different versions I have attempted:
// 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');
}),
Within my template, I test all my functions as follows:
<h4>TestB</h4>
{{#each testB as |wg|}}
{{wg}}<br>
{{wg.label}}<br>
{{/each}}
testB: {{testB}}<br>
testB.length: {{testB.length}}<br>
and all (except for the last testD) render like this:
TestB
testB: [object Object]
testB.length:
whereas I expect/want them to display like this:
TestB
<DS.PromiseObject:ember1117>
BB-Promotion
testB: <DS.PromiseObject:ember1117>
testB.length: 1
I acknowledge there are alternative solutions to this (such as setting another property upon resolving), but I prefer to accomplish it correctly and understand the process thoroughly. I am aware that these examples may seem simplistic. This is just the initial functionality, which will be expanded once I achieve successful implementation.