jeudi 15 octobre 2020

Ember.JS Using async method in computed property

So in my template I need to iterate through an array of Ember data store items.


    
        
    

But I can't simply pump the items from the ember data store into the array, so listItems is a computed property to format the items as needed.

@computed('itemsArray', 'idx')
get listItems() {
    const items = this.itemsArray;
    return items.map((item, index) => {
        return {
            data: item.data,
            visible: index === idx
        };
    });
}

My problem comes into initilizing the itemsArray. I need to get it from the data store, which is asynchronous, however neither a constructor or computer property can be async to await the operation. I need to setup itemsArray as an array with my first data record. Is there a way to await or wait on the promise to resolve inside a computed property (check if itemsArray is empty and if so set it up) or get it in some other way? I thought of concurrency tasks at first but forgot they need to be awaited when called too. If it matters for the store, I am using below to fetch my record (using find as I want to query for it):

await this.store.findRecord('category/items', id);



Aucun commentaire:

Enregistrer un commentaire