Accessing hasMany relationship in template renders "DS.PromiseManyArray"

Questions
1

I have two models, collection and tag. They have a hasMany relationship with one another, like so:

export default class CollectionModel extends Model {
    @attr('date') createdDate;
    @attr('date') modifiedDate;
    @attr('string') name;
    @hasMany('tag') tags;
}

export default class TagModel extends Model {
    @attr('date') createdDate;
    @attr('date') modifiedDate;
    @attr('string') content;
    @hasMany('note') notes;
    @hasMany('collection') collections;
}

On a route, I’m trying to fetch the collections and include their tags:

    model() {
    return RSVP.hash({
        collections: this.store.findAll('collection', { include: 'tags' }),
        users: this.store.findAll('user')
    });
}

And then display each collection and its list of tags in a table.

{{#each this.model.collections as |collection|}}
        <tr>
            <td>{{collection.name}}</td>
            <td>
                {{collection.tags}} {{!-- this is what renders DS.PromiseManyArray, the each block below doesn't work at all --}}
                {{#each collection.tags as |tag|}}
                    {{tag.name}}
                {{/each}}

For whatever reason, the tag names are not rendering as expected. Instead, all I see is “DS.PromiseManyArray:ember236” where it should be rendering the list of tags. Can anyone offer any insights as to what I’m doing wrong? I was under the impression the “include” option would mean the tag records would be fully loaded and accessible. I see them returning in the API response, as can be seen here:

 {
"jsonapi": {
    "version": "1.0"
},
"meta": {
    "count": 2
},
"links": {
    "self": "/collections?include=tags"
},
"data": [
    {
        "type": "collections",
        "id": "247",
        "attributes": {
            "name": "new collection",
            "created-date": "2020-10-12T15:11:13.523Z",
            "modified-date": "2020-10-12T15:11:13.523Z"
        },
        "relationships": {
            "user": {
                "links": {
                    "self": "/collections/247/relationships/user",
                    "related": "/collections/247/user"
                },
                "data": null
            },
            "tags": {
                "links": {
                    "self": "/collections/247/relationships/tags",
                    "related": "/collections/247/tags"
                },
                "data": [
                    {
                        "type": "tags",
                        "id": "163"
                    },
                    {
                        "type": "tags",
                        "id": "164"
                    },
                    {
                        "type": "tags",
                        "id": "165"
                    }
                ]
            }
        },
        "links": {
            "self": "/collections/247"
        }
    },
    {
        "type": "collections",
        "id": "248",
        "attributes": {
            "name": "foobar",
            "created-date": "2020-10-12T15:48:25.400Z",
            "modified-date": "2020-10-12T15:48:25.400Z"
        },
        "relationships": {
            "user": {
                "links": {
                    "self": "/collections/248/relationships/user",
                    "related": "/collections/248/user"
                },
                "data": null
            },
            "tags": {
                "links": {
                    "self": "/collections/248/relationships/tags",
                    "related": "/collections/248/tags"
                },
                "data": [
                    {
                        "type": "tags",
                        "id": "166"
                    },
                    {
                        "type": "tags",
                        "id": "167"
                    }
                ]
            }
        },
        "links": {
            "self": "/collections/248"
        }
    }
],
"included": [
    {
        "type": "tags",
        "id": "163",
        "attributes": {
            "content": "Grant",
            "created-date": "2020-10-11T21:37:23.525Z",
            "modified-date": "2020-10-11T21:37:23.525Z"
        },
        "relationships": {
            "user": {
                "links": {
                    "self": "/tags/163/relationships/user",
                    "related": "/tags/163/user"
                },
                "data": null
            },
            "notes": {
                "links": {
                    "self": "/tags/163/relationships/notes",
                    "related": "/tags/163/notes"
                },
                "data": [
                    {
                        "type": "notes",
                        "id": "299"
                    }
                ]
            },
            "collections": {
                "links": {
                    "self": "/tags/163/relationships/collections",
                    "related": "/tags/163/collections"
                },
                "data": [
                    {
                        "type": "collections",
                        "id": "247"
                    }
                ]
            }
        },
        "links": {
            "self": "/tags/163"
        }
    },
    {
        "type": "tags",
        "id": "164",
        "attributes": {
            "content": "Civil War",
            "created-date": "2020-10-11T21:37:35.390Z",
            "modified-date": "2020-10-11T21:37:35.390Z"
        },
        "relationships": {
            "user": {
                "links": {
                    "self": "/tags/164/relationships/user",
                    "related": "/tags/164/user"
                },
                "data": null
            },
            "notes": {
                "links": {
                    "self": "/tags/164/relationships/notes",
                    "related": "/tags/164/notes"
                },
                "data": [
                    {
                        "type": "notes",
                        "id": "299"
                    }
                ]
            },
            "collections": {
                "links": {
                    "self": "/tags/164/relationships/collections",
                    "related": "/tags/164/collections"
                },
                "data": [
                    {
                        "type": "collections",
                        "id": "247"
                    }
                ]
            }
        },
        "links": {
            "self": "/tags/164"
        }
    },
    {
        "type": "tags",
        "id": "165",
        "attributes": {
            "content": "1860",
            "created-date": "2020-10-11T21:37:49.246Z",
            "modified-date": "2020-10-11T21:37:49.246Z"
        },
        "relationships": {
            "user": {
                "links": {
                    "self": "/tags/165/relationships/user",
                    "related": "/tags/165/user"
                },
                "data": null
            },
            "notes": {
                "links": {
                    "self": "/tags/165/relationships/notes",
                    "related": "/tags/165/notes"
                },
                "data": [
                    {
                        "type": "notes",
                        "id": "295"
                    }
                ]
            },
            "collections": {
                "links": {
                    "self": "/tags/165/relationships/collections",
                    "related": "/tags/165/collections"
                },
                "data": [
                    {
                        "type": "collections",
                        "id": "247"
                    }
                ]
            }
        },
        "links": {
            "self": "/tags/165"
        }
    },
    {
        "type": "tags",
        "id": "166",
        "attributes": {
            "content": "hello",
            "created-date": "2020-10-12T15:48:12.033Z",
            "modified-date": "2020-10-12T15:48:12.033Z"
        },
        "relationships": {
            "user": {
                "links": {
                    "self": "/tags/166/relationships/user",
                    "related": "/tags/166/user"
                },
                "data": null
            },
            "notes": {
                "links": {
                    "self": "/tags/166/relationships/notes",
                    "related": "/tags/166/notes"
                },
                "data": [
                    {
                        "type": "notes",
                        "id": "299"
                    }
                ]
            },
            "collections": {
                "links": {
                    "self": "/tags/166/relationships/collections",
                    "related": "/tags/166/collections"
                },
                "data": [
                    {
                        "type": "collections",
                        "id": "248"
                    }
                ]
            }
        },
        "links": {
            "self": "/tags/166"
        }
    },
    {
        "type": "tags",
        "id": "167",
        "attributes": {
            "content": "world",
            "created-date": "2020-10-12T15:48:14.306Z",
            "modified-date": "2020-10-12T15:48:14.306Z"
        },
        "relationships": {
            "user": {
                "links": {
                    "self": "/tags/167/relationships/user",
                    "related": "/tags/167/user"
                },
                "data": null
            },
            "notes": {
                "links": {
                    "self": "/tags/167/relationships/notes",
                    "related": "/tags/167/notes"
                },
                "data": [
                    {
                        "type": "notes",
                        "id": "299"
                    }
                ]
            },
            "collections": {
                "links": {
                    "self": "/tags/167/relationships/collections",
                    "related": "/tags/167/collections"
                },
                "data": [
                    {
                        "type": "collections",
                        "id": "248"
                    }
                ]
            }
        },
        "links": {
            "self": "/tags/167"
        }
    }
]
}
2

Your hasMany tags relationship is still asynchronous by default, so getting a DS.PromiseManyArray is expected. You can make it synchronous like @hasMany('tag', { async: false }), but just remember that means you’re responsible for always using include where needed – if some other place in your app tries to list the tags when they weren’t included, they just won’t be there.

But that doesn’t explain why your {{#each collection.tags}} isn’t rendering. It should, even with an asynchronous relationship, because the template knows how to update automatically when asynchronous data loads. Something else is going on here, I’d suggest dropping into a debugger to confirm what’s really accessible on your models. You can use collection.hasMany('tags') to use the references API to ask questions about what is already loaded and what the values are.

4

Thanks for the response! Was able to figure it out with your debugger suggestion.