Angular 2 - 为ngIf

时间:2017-08-22 20:53:35

标签: javascript angular typescript

在我的情况下,我需要根据用户ID或this.uid显示事件,但我不确定如何使其正常工作。

视图

<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>

成分<​​/ P>

  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;

  }

1 个答案:

答案 0 :(得分:0)

修改checkGuest以返回Observable,然后再次使用async管道。

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>