Полимер: как повторять выпадающие предметы

Question

Я использую выпадающее меню для бумаги из полимерной бумаги.

Мне нужно, чтобы показать падение вниз для чисел от 1 до 5. Сырой способ сделать это

<paper-dropdown-menu label="Numbers" > 
    <paper-dropdown class="dropdown"> 
    <core-menu class="menu"> 
     <paper-item>1</paper-item> 
     <paper-item>2</paper-item> 
     <paper-item>3</paper-item> 
     <paper-item>4</paper-item> 
     <paper-item>5</paper-item> 
    </core-menu> 
</paper-dropdown> 

Есть ли способ, чтобы избежать повторения <paper-item> кода с помощью <template> Что-то вроде:

<template repeat="{{ i in [0:25] }}"> 
     <paper-item>i</paper-item> 
    </template> 

Answer 1

вы могли бы сделать функцию «диапазон» для создания массива затем использовать массив в методе уже размещены.

что будет выглядеть как

<paper-dropdown-menu label="Numbers" > 
    <paper-dropdown class="dropdown"> 
    <core-menu class="menu"> 
     <template repeat="{{range}}"> 
     <paper-item>{{}}</paper-item> 
     </template> 
    </core-menu> 
    </paper-dropdown> 
</paper-dropdown-menu> 

затем в JS вы создаете функцию диапазона

var range = function(begin, end) { 
    if (typeof end === "undefined") { 
    end = begin; begin = 0; 
    } 
    var result = [], modifier = end > begin ? 1 : -1; 
    for (var i = 0; i <= Math.abs(end - begin); i++) { 
    result.push(begin + i * modifier); 
    } 
    return result; 
} 

функция этот диапазон пришел с этого поста, который также имеет несколько методов Diff для этого. Does JavaScript have a method like "range()" to generate an array based on supplied bounds?

затем присвоить диапазон для переменной полимера шаблон повторения с использованием

this.range = range(1,25); 

надеюсь, что это помогает. жаль, что я не мог ответить вчера, уходил на работу, когда я отправил последний ответ.

редактировать: пример на plunker http://plnkr.co/edit/4TkQdR2B5vakbwOSAulK?p=preview

Answer 2

Как указано в комментариях, в демонстрации представлен пример, представленный полимером. https://github.com/Polymer/paper-dropdown/blob/master/demo.html

<x-trigger icon="menu"> 
    <paper-dropdown class="with-margin"> 
    with margin<br> 
    <br> 
    <template repeat="{{countries}}"> 
     {{name}}<br> 
    </template> 
    </paper-dropdown> 
</x-trigger> 


scope.countries = [ 
    {name: 'Afghanistan', code: 'AF'}, 
    {name: 'Åland Islands', code: 'AX'} 
];