Вызов метода изнутри дом-повтор в полимере

Question

У меня такая ситуация, когда мне нужно вызвать метод из Dom-Repe. Ниже мой код

<template is='dom-repeat' items="[[_dataArray]]" as="rowItem">
     <template is='dom-repeat' items="[[_objectArray]]" as="columnItem">
         <template>
             <span>[[_getColumnItemValue(rowItem, columnItem)]]</span>
         </template>
     </template>
</template>

и в моем _getColumnItemValue метод, я хочу получить значение для объекта с ключом, указанным columnData приписывать.

подобно rowData[columnData]

_getColumnItemValue: function(rowData, columnData) {
    return rowData[columnData];
}

Моя проблема в методе _getColumnItemValue не вызывается. Есть ли лучший способ добиться этого?

Answer 1

Если ваш код точно такой же, как вы вставили, значит у вас слишком много <template> теги.

<template is='dom-repeat'>
  <template is='dom-repeat'>
     <span></span>
  </template>
</template>

Внутренний шаблон должен быть удален. Вы делаете это вместо <span>,

Answer 2

Наконец-то я смог заставить эту вещь работать. Не совсем в этом случае, но в другом проекте, с точно такой же логикой. Единственным изменением было то, что мой _objectArray был не массивом строк, а массивом объектов. Так что код будет выглядеть так:

<template is="dom-repeat" items="{{tableData}}" as="rowData"> <tr> <template is="dom-repeat" items="{{headers}}" as="columnData"> <td> <template is="dom-if" if="{{checkType(columnData, 'check')}}"> <paper-checkbox disabled="{{getAttributeValue(columnData, 'disabled')}}" checked="{{getRowData(rowData, columnData)}}" on-change="checkBoxSelected"></paper-checkbox> </template> <template is="dom-if" if="{{checkType(columnData, 'led')}}"> <led-indicator on="{{!getRowData(rowData, columnData)}}"></led-indicator> <span style="display: none;">{{getRowData(rowData, columnData)}}</span> </template> <template is="dom-if" if="{{checkType(columnData, 'link')}}"> <a href="javascript:void(0)" on-click="tableRowClicked">{{getRowData(rowData, columnData)}}</a> </template> <template is="dom-if" if="{{checkType(columnData, 'text')}}"> <span>{{getRowData(rowData, columnData)}}</span> </template> </td> </template> </tr> </template>

Смотрите метод getRowData

getRowData: function (row, column) { return row[column.key]; },а также

checkType: function (columnData, type) { var isType = false; isType = columnData.type.toLowerCase() == type.toLowerCase(); return isType; },

Это для таблицы, которая может динамически добавлять или удалять строки и столбцы и отображать различные типы элементов, такие как текст, ссылка, флажок некоторых из моих пользовательских элементов управления, таких как led-индикатор и т. Д.

Логика заключается в том, что массив заголовков будет использоваться для генерации столбцов таблицы, этот массив содержит объекты структуры

{ name: 'Popular Name', key: 'PopularName', type: 'text' }

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