I have a firestore database with the `world` collection with a sub-collection `languages`

I've made two functions, one to retrieve every document from the sub-collection `languages` and one function where to get every language if the `userUid` value is in the `userUids` array

Here is a brief example of the data:

```
uid: string;
label: string; // The language label (e.g. French, English, Chinese, etc)
userUids: string[]; // This is where it has every uid from the users who speak the language

```

Now, I'm trying to get every check boxes checked in real-time based on the current `userUid` is in the `userUids` array while still having to show every checkbox.

What I'm expecting: 

```
- [x] French  // This is checked because the current userUid is in the userUids array
- [x] English // Same as above
- [ ] Chinese // Not checked because it is not in the current userUid array
- [ ] Russian // Same as above
- [ ] Other   // Same as above

```

What I'm getting instead:

Everything is checked

```
- [x] French
- [x] English
- [x] Chinese
- [x] Russian
- [x] Other

```

What I tried:

HTML: 

```html
<div class="language" *ngFor="let language of worldLanguages">
  <input
    type="checkbox"
    [attr.checked]="spokenLanguages ? language : false"
    [value]="language"
    (change)="toggleLanguage($event, language)"
>
  {{language.label}}
</div>

```

Component: 

```js
user: User; // Current user

// worldLanguages and spokenLanguages are basically an array of the data above
ngOnInit() {
  this.worldLanguages = this.worldService.getAllLanguages(this.user.worldUid); // Get every language
  this.spokenLanguages = this.worldService.getAllSpokenLanguages(this.user.worldUid, this.user.uid); // Get every spoken languages (where user.uid is in the userUids array)
}

// Language is based on the data above
toggleLanguage(event, language: Language) {
  if (event.target.checked) {
    this.worldProvider.addUserToLanguage(language.uid, this.user.worldUid, this.user.uid);
  } else {
    this.worldProvider.removeUserToLanguage(language.uid, this.user.worldUid, this.user.uid);
  }
}

```

How can I get one checkbox checked based on if the `userUid` is in the `userUids` array?

Edit: Here are the functions from the service

```
  getAllLanguages$(worldUid: string): Observable<Language[]> {
    return this.userProvider.user$.pipe(
      switchMap((user: User) => {
        if (!user) return of([]);

        return this.afs.doc(`worlds/${worldUid}`).collection('languages', ref => ref
          .where('userUid', '==', user.uid)
        )
        .valueChanges()
        .pipe(
          map((sLanguages: ServerLanguage[]) => sLanguages
            .map(sLanguage => new Language(sLanguage))
            .sort((a: Language, b: Language) => a.label > b.label ? 1 : -1)
          )
        );
      })
    );
  }

  getAllSpokenLanguages$(worldUid: string, entityUid: string): Observable<Language[]> {
    return this.userProvider.user$.pipe(
      switchMap((user: User) => {
        if (!user) return of([]);

        return this.afs.doc(`worlds/${worldUid}`).collection('languages', ref => ref
          .where('userUid', '==', user.uid)
          .where('entityUids', 'array-contains', entityUid)
        )
        .valueChanges()
        .pipe(
          map((sLanguages: ServerLanguage[]) => sLanguages
            .map(sLanguage => new Language(sLanguage))
            .sort((a: Language, b: Language) => a.label > b.label ? 1 : -1)
          )
        );
      })
    );
  }

```