Question

<template repeat="memberId in members | objKeys">
  <firebase-element data={{member}} location="{{'SOME_LOCATION/' + memberId}}"></firebase-   element>
  <h2>member.name</h2>
</template>

objKeys: function(members) {
  return Object.keys(members);
}

数据看起来像这样

members = {
   'memberId_1': true,
   'memberId_2': true,
   'memberId_3': true
}

并在另一个位置存储实际用户数据。

在这里，我希望模板重复相应地呈现每个用户（member1，member2，member3）。但是，它为3个条目打印出相同的名称，就像它在模板重复中为所有3个firebase元素重用变量“member”一样，这实际上没有意义。

我试图修改objKeys函数以返回

[ {memberId: memberId_1, member: {}}, 
  {memberId: memberId_2, member: {}},
  {memberId: memberId_3, member: {}]

然后将内部成员对象用于firebase元素，但结果仍然相同

<template repeat="{{item in members | objKeys}}>
  <firebase-element data={{item.member}} location={{'SOME_LOCATION/' + item.memberId}}>    </firebase-element>
</template>

我不明白模板重复正确并在此处使用不正确吗？或者它是聚合物模板的错误。

Answer 1

我认为问题在于转发器将{{member}}绑定到自身。

检查您的Firebase - 您会看到该绑定不仅会在您的视图中重复显示名称名称，还会在Firebase中将所有值设置为相同的名称。

请尝试使用{{members[memberId}}：

<polymer-element name="member-test">

<template>
<firebase-element data="{{members}}" location="{{'https://YOUR_APP_NAME.firebaseio.com/members/'}}"></firebase-element>
<template repeat="{{memberId in members | objKeys}}">
  <firebase-element data="{{members[memberId]}}" location="{{'https://YOUR_APP_NAME.firebaseio.com/members/' + memberId}}"></firebase-element>
  <h2>{{members[memberId].name}}</h2>
</template>
</template>

<script>
Polymer({

  objKeys: function(members) {
    if(!members) return null;
    return Object.keys(members);
  }

});
</script>

</polymer-element>

这假设您的Firebase具有以下格式的数据：

{ members:
  { memberID1: { name: "Name1" },
    memberID2: { name: "Name2" }
  }
}

在模板重复内部使用firebase-element显示错误

1 个答案: