时间戳

首页 > 解决方案 > 使用角度调用单击函数时如何更新循环内的get函数？

angular - 使用角度调用单击函数时如何更新循环内的get函数？

问题描述

我正在使用 ng-repeat 来显示使用角度的对象列表。我想更改循环内的值，例如，如果我点击下方的喜欢或不喜欢链接，将显示计数。截至目前，我正在计算如下代码

<div layout="column" class="mr-3" *ngFor ="let obj of objects; let i=index">
<div class="column" (click)="updatelike(obj, 'like')" style="cursor: pointer;">
<mat-icon>thumb_up</mat-icon>
</div>
<div class="column" >{{getLikeCount(obj)}}</div>
</div>

单击updatelike(obj, 'like')我正在另一个表中更新时。每当加载整个 div 时，getLikeCount(obj)函数都会检查另一个并返回计数。问题是每当我单击类似更新的链接时，我都需要使用 ngOninit() 来调用并再次加载整个列表。除了加载整个列表之外，还有可能使用索引单击并立即获取计数。

标签： angular

解决方案

单击 后，您向服务器发送值完全没问题updatelike()。

您可以直接以角度更新它，而不是再次获取这些值。

在 HTML 中 -

<div layout="column" class="mr-3" *ngFor ="let obj of objects; let i=index">
  <div class="column" (click)="updatelike(obj, i)" style="cursor: pointer;">
    <mat-icon>thumb_up</mat-icon>
  </div>
  <div class="column" >{{getLikeCount(obj)}}</div>
</div>

在updatelike()

private isClicked: any[]; //array to define clicking events on each obj item.

ngOnInit(){
  for(let i=0; i<objects.length; i++){
    this.isClicked[i] = false;
  }
}

updatelike(obj, index) {

  if(this.isClicked[i]){

    obj.likes--;
    this.isClicked[i] = false;

  }else{

    obj.isLiked++;
    this.isClicked[i] = true;

  }

}

推荐阅读