Question

我开始搞乱Polymer，我已经用社交媒体卡完成了基本教程。在其中，几个卡片护理循环为repeat="{{post in posts}}"。我想做的是repeat="{{post in range 1...10}}"之类的事情。最后，我想使用已发布的属性cols来提供最大值而不是10.我已经能够通过将cols属性设置为类似[1,2，... 。，9]但这对任何大的价值观都是不合理的。我还通过使用ready函数并执行this.colsAr = new Array(cols)，然后在重复`{{col in colsAr}}中对此进行了扩展。

循环可变数量元素的最佳/正确方法是什么？数字由属性决定？

要添加到此，还可以说cols属性是通过select输入动态更改的。选择新值时，这会导致重新绘制。

Answer 1

通常，最好的方法是使用计算属性来表示过滤后的数组。

这样的事情：

 <template repeat="{{post in slice}}">
   ...
  computed: {
    slice: 'sliced(posts)'
  },
  sliced: function(posts) {
    return posts.slice(1, 3);
  }

但是，现在，计算属性引擎不会自动ArrayObserve posts，所以我们必须在Array结构发生变化时手动强制重新计算。

  kick: 0,
  computed: {
    slice: 'sliced(posts, kick)'
  },
  sliced: function(posts) {
    return posts.slice(1, 3);
  },
  postsChanged: function() {
    this.kick++;
  }

增加kick会强制数据引擎重新计算slice（给它一脚）。 Fwiw，我们正在努力改善这种特殊情况，但上述技术应该在短期内发挥作用。

工作示例：

http://jsbin.com/dadeto/3/edit

Google Polymer重复值的范围为1 ... n

1 个答案: