javascript - 数组内具有特定属性的 polymer 计数元素

Question

我正在使用 Polymer在一个项目上。对于某个元素，我有一个数组作为输入。该数组包含具有例如 bool favorite 的 JSON 对象.

如果没有对象被收藏，我想显示一条消息。我知道如何遍历 <template> 中的数组我知道如何使用 filters ，但我不知道如何有效地做到这一点。

目前我的元素中有一个额外的对象，它通过循环存储收藏元素的数量，但这似乎效率很低。

dataChanged: function(){
    this.nrOfFavorites = 0;
    for(test in this.data){
        if(test.favorite){
            this.nrOfFavorites++;
        }
    }
}

另外，使用这个我遇到了一些问题，在其他方法中调用 this.fire('dataChanged')没有调用该函数，因此我无法在(取消)收藏一个项目后重新计算收藏的数量。执行此操作的建议方法是什么？

Answer 1

如您所见(!)，您无法设置 *Changed更改数组中对象的属性时触发的处理程序。您现有的 dataChanged只有在 data 中添加或删除对象时才会触发处理程序数组，如果现有对象的属性发生更改则不会。

我已经组合了一个 Polymer 元素， <observe-array-items> ，这使得观察数组中项目的特定属性的变化成为可能。您可以直接使用它，也可以复制逻辑。

一旦您获得 dataChanged处理程序正确触发，您可以维护一个跟踪收藏夹数量的计数器(如果跟踪它对您的应用程序有用)或使用类似 Array.prototype.some() 的东西查看是否有任何带有 favorite 的对象设置。

类似于:

dataChanged: function() {
  this.atLeastOneFavorite = this.data.some(function(item) {
    return item.favorite;
  });
}