javascript - 获取数组中选定对象的索引

Question

我正在使用 *ngFor 来迭代数组。显示的数据类似于新的提要，用户可以在其中提交更新，并且它将显示用户名、状态、“喜欢”按钮和“收藏夹”按钮。我正在开发一项功能，该功能将在单击“收藏夹”按钮后将状态添加到“收藏夹”。我遇到的问题是确保单击收藏按钮的状态会将该特定状态添加到收藏夹中。我能想到的最好方法是在该用户的状态数组中找到状态描述的索引，并使用它来指定要添加的状态。

对象的结构如下所示:

users.feed.description

其中，users = 用户，feed = 状态，description = 状态描述

我能够做的是通过以下方式指定用户和状态:

users[0].feed[0].description

我认为需要做的是找到所选描述的索引并将其作为分配给提要的值返回:

users[0].feed[i].description

我知道我需要在 addFavorites 函数中使用类似于 for 循环的东西，但我似乎无法正常运行。我希望这是足够的信息。

我的 addFavorites 函数当前是:

addToFavorites(){
console.log('Adding to Favorites ' + this.users[0].feed[0].description);
this.favorite = this.favoritesprovider.addFavorites(this.users[0].feed[0].description);
this.toastCtrl.create({
  message: this.users[0].feed[0].description + ' has been added to your favorites!',
  duration: 3000
  }).present();
 }

它只会添加索引为 0 的描述(因为这是定义的)。我知道我的 for 循环应该反射(reflect)类似于

function findWithAttr(array, attr, value) {
for(var i = 0; i < array.length; i += 1) {
    if(array[i][attr] === value) {
        return i;
    }
}
return -1;
}

我从 How to get index of object by its property in javascript 得到的但我就是不知道如何让事情正常工作。

感谢任何帮助

Answer 1

如果您使用的是*ngFor，那么您应该有权访问当前索引，然后能够将其数据绑定(bind)到div。见下文

<!-- Angular -->
<div class="feed">
  <div class="feed-item" *ngFor="let feedItem of feedItems; let i = index" [attr.data-index]="i">
    {{i}} {{feedItem}}
  </div>
</div>

然后您可以将 data-index 属性获取为 i。