Question

acceptRequest（child.component中的委托人函数将commissioner.requestAccepted设置为false，然后返回更新的委托人对象。

我想要完成的是在更新对象后从视图中删除按钮，但这不会发生。我必须刷新页面才能使按钮消失。

parent.component.ts

commissioners: any[];

ngOnInit() {
    this.usersService.getCommissioners().subscribe(
      res => {
        this.commissioners = res.commissioners;
      },
      err => {
        console.log(err);
      }
    )
  }

parent.component.html

<child-list *ngIf="commissioners" [commissioners]="commissioners"></child-list>

child.component.ts

  @Input() commissioners: any[];

  ngOnChanges(changes: SimpleChange) {
    this.commissioners = changes['commissioners'].currentValue;
  }

  acceptRequest(commissionerId) {
    this.usersService.acceptRequest(commissionerId)
      .subscribe(
        res => {
          for (let commissioner of this.commissioners) {
            if (commissioner._id == res._id) {
              console.log(commissioner); //old object (requestAccepted: false)
              commissioner = res;
              console.log(commissioner); //new object (requestAccepted: true)
              break;
            }
          }
        },
        err => {
          console.log(err);
        });
  }

child.component.html

<div *ngFor="let commissioner of commissioners">
   <button *ngIf="!commissioner.requestAccepted" class="btn btn-primary" (click)="acceptRequest(commissioner._id)">Accept</button>
</div>

Answer 1

~~我的猜测是你的if声明是假的。嗯，这是错误的，但它很可能是您面临的问题的解决方案。您应该使用===：~~

另一点是你没有更新数组本身，只是更改了对局部变量的引用，这使得代码变得更加容易：

res => {
    for(let i = 0, l = this.commissioners.length; i < l; i++) {
        if (this.commissioners[i]._id === res._id) {
            this.commissioners[i] = res;
            break;
        }
    }
}

视图不会更新对象更新

1 个答案: