Search code examples
angularngrx-store

How to check for a value in array of strings with ngIf using async pipe?


I manage my app state using NgRx-store. the slice of the store data that I am checking in could be a string or an array of strings. I want to check whether that string or array has a certain value using *ngIf?

what I am doing right now is that I am subscribing to the slice of the store value and returning a boolean constant to *ngIf.

in my component,

isRegistry: boolean;
isEmbryology: boolean;
authStoreData: Subscription;
 ngOnInit() {
    this.authStoreData = this.store.select(c => c.auth).subscribe(
      (data: fromAuth.State) => {
        const userDatabases = data.entities[fromAuth.authId].userData.userDatabases;
        let userDatabaseCollection: Array<string> = [];
        isArray(userDatabases) ? userDatabaseCollection = userDatabases :
        userDatabaseCollection.push(userDatabases);
        for (const databaseKey in userDatabaseCollection) {
          if (userDatabaseCollection[databaseKey]) {
            if (userDatabaseCollection[databaseKey] === 'Clinic Database') { this.isRegistry = true; };
            if (userDatabaseCollection[databaseKey] === 'Embryology Database') { this.isEmbryology = true; };
          }
        };
      }
    );


   }
  ngOnDestroy() {
    this.authStoreData.unsubscribe();
  };

and in my template, I check for isRegistry,isEmbryology, etc ..

my approach now is to select the slice of the store using the async pipe to get the data, but I don't know how to look for a value if I am dealing with an array here; something like this

authData: Observable<any>;
this.authData = this.store.select(c => c.auth.entities[fromAuth.authId]);

and in my template

 <li *ngIf="(authData | async ).userData.userDatabases == 'Clinic Database'">

Solution

  • The answer was in front of my face, .includes()

    <li *ngIf="(authData | async).userData.userDatabases.includes('Clinic Database')" >