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

【问题标题】：Angular does not update "input property" when * gnFor adds new item from an observable当 * gnFor 从 observable 添加新项目时，Angular 不会更新“输入属性”
【发布时间】：2018-03-04 00:11:03
【问题描述】：

我有两个组件 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>

like-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;
      }
    });



  }


.....

}

如果在 home.components.html 中没有发送新的项目传输但是当新项目到达时，我在 ngOninit() 生命钩子上检索输入属性可以正常工作，但当新项目到达时，如评论发送最后添加的项目而不是新项目。

感谢任何帮助。

【问题讨论】：

标签： angular firebase ionic2

【解决方案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;
    }
  });
  
}

【讨论】：