Inconsistent results from collectionData()

**Angular:13.2.2
**Firebase:9
**AngularFire:7.3.0
**Other (e.g. Ionic/Cordova, Node, browser, operating system): Google Chrome Version 102.0.5005.61 (Official Build) (x86_64)

### Actual behavior

Hi, i don't know if this is a bug or a cache-related issue.
But when i use a Angular resolver to resolve data from my service i get Inconsistent results from my query.
Take this simple method for an example:

`getAllUserTeams(userId: string): Observable {

const _query = query(
this.collection,
where('userId', '==', userId),
orderBy('createdAt', 'asc')
);

return collectionData(_query, { idField: 'id' }) as Observable<
ITeam[]
>;
}`

This method should return all the users team. But when i use this in my resolver it only runs once obviously and the results varies for each reload or navigation. But when i use the method with a realtime subscription in the component is shows the correct number of teams.

So should i use getDocs instead of collectionData for these situations? But if i use getDocs i loose the ability to auto-convert it to a model and need to do that manually..

### Expected behavior
Return the correct teams.

Best regards!

Start with the Angular resolver and getAllUserTeams(), then compare the collectionData() query with the realtime component subscription and the proposed getDocs() path. Reproduce the reload or navigation behavior in the stated Angular, Firebase, and Chrome versions; done means the resolver consistently returns all matching teams.

Do mô hình lập chỉ mục viết ra từ nội dung của issue.