当* gnFor从observable添加新项时，Angular不会更新“输入属性”

Question

我有两个组件home.component.ts和它的子like-review.component.ts我通过输入绑定发送几个参数到like.component.ts当一个新的传输来自firebase输入绑定Angular不更新它发送传输的最后一项的参数，为了更新我必须刷新页面并且它的参数正确发送。

home.component.html

<ng-container *ngFor="let card of cards | async;trackBy:trackByFn; let i = index">
  ....
  
      <like-review [card]="card" [userId]="uid"></like-review>


  ...
</ng-container>

样review.component.ts

@Component({
  selector: 'like-review',
  templateUrl: 'like-review.html'
})
export class LikeReviewComponent implements OnInit, AfterViewChecked, AfterContentInit {

  @Input() userId;
  @Input() card: Card;

  likesObservable: Observable<any>;


 .....
}
  ngOnInit() {
 
     
    this.likesObservable = this.fav.getUserLike(this.userId, this.card.id).map(data => {
      if(data == null) {
        return false;
      }else{
        return data.like;
      }
    });



  }


.....

}

我在ngOninit（）生命钩上检查输入propietys工作正常如果在home.components.html不发送新的项目传输但是当新项目到达时 - 审查发送最后添加的项目而不是新项目。

任何帮助，它的赞赏。

Answer 1

修复它，来自ngOnChanges或输入设置器的子调用firebase引用

  @Input() card: Card;

get mycard(): Card {

  return this.card;

}


ngOnChanges(changes: SimpleChanges) {
  console.log('valor anterior', changes.card.previousValue);
  console.log('valor valor actual.', changes.card.currentValue);
  debugger
  this.likesObservable = this.fav.getUserLike(this.userId, this.mycard.id).map(data => {
    if(data == null) {
      return false;
    }else{
      return data.like;
    }
  });
  
}