javascript - polymer 数字重复模板

Question

我有一个获取 JSON 对象列表的组件。

我想这样做:{{i+1}}在 <p> 的输出中-标记它有效(如果i=0它显示1)

但是，如果我对属性 number 尝试这样做在 <event-component> ，它不起作用。输出是:<event-component number= {{i+1}}>

有什么建议吗？

<template repeat="{{event, i in data}}">
        <p> {{i+1}} {{event.title}} </p> 
        <p> {{event.description}} </p> 
        <event-component number= '{{i+1}}' detail= 'false'></event-component>
    </template>

Answer 1

问题出在您未提供的代码中的某个地方。让我们简化一下代码片段:

<polymer-element name="my-polymer-el">
    <template>
      <template repeat="{{event,i in data}}">
        <p><em> {{i+1}} </em></p> 
        <p><b> {{event.name}} </b></p> 
      </template>
      <select>
        <template repeat="{{event,i in data}}">
          <option value="{{i+1}}"> {{i+1}} :: {{event.name}} </opion> 
        </template>
      </select>
    </template>  
    <script>
      Polymer({
        publish: { data: { value: [
          {name:'First'},
          {name:'Second'},
        ], reflect: true } }
      });
    </script>
  </polymer-element>

输出符合预期:i+1 随处计算。您应该仔细检查event-component代码和/或您的脚本。

实时预览:http://plnkr.co/edit/ebEI0CptyBMOqtii86Vw?p=preview