Angular 2-为ngIf中的元素返回true或false

Question

I need to show events based on user id or this.uid in my case, but I'm not sure how to get it working.

view

<md-card *ngFor="let event of events | async">
    <a *ngIf="checkGuest(event.$key) === true" [routerLink]="['event', event.$key]">
        <img class="event-img" src="http://lorempixel.com/30/30" />{{ event.name }}</a>
</md-card>

component

  checkGuest(eventKey: string): void {

    this.db.object(`/events/${eventKey}/guests/${this.uid}/`)
      .subscribe(user => this.hello(user));
  }

  hello(user): Boolean {
    console.log(user);

    if (user) {
      console.log('hello');
      this.isUser = true;
    }

    return false;

  }

Answer 1

Modify your checkGuest to return an Observable , then use the async pipe again.

checkGuest(eventKey: string): Observable<boolean> {
    // a return here
    return this.db.object(`/events/${eventKey}/guests/${this.uid}/`)
        .map((user) => this.hello(user));
  }

  hello(user): Boolean {
    console.log(user);

    if (user) {
      console.log('hello');
      this.isUser = true;
      // you need a return here
      return true;
    }

    return false;

  }

<md-card *ngFor="let event of events | async">
    <a *ngIf="checkGuest(event.$key) | async" [routerLink]="['event', event.$key]">
        <img class="event-img" src="http://lorempixel.com/30/30" />{{ event.name }}</a>
</md-card>