Атрибутът на данните не е достъпен при използване на събитие с бутон за хартия в Polymer 1.0

Публикувам това, защото отговорът, публикуван в тази SO нишка не работи за мен. Искам да предам допълнителни параметри на данни към манипулатор на събития при натискане от бутон за хартия (в повторение на dom). Резултатите, използващи следните кодови фрагменти, предоставят елемент на подхартиен материал без данни.

Използвайки:

<template is="dom-repeat" items="{{someParam}}>
  <paper-button on-tap="_handleTap" data-args="{{item}}">...</paper-button>
</template>

И работа с:

var args = e.target.getAttribute('data-args').split(',');

or

e.target.dataset.args

И двете връщат <paper-material ...>...</paper-material>

Какво става? Защо целите не връщат натиснатия хартиен бутон или данните в него?!


javascript parameter-passing polymer polymer-1.0
person Sean    schedule 09.09.2015    source източник

Отговори (3)


arrow_upward
4
arrow_downward

Най-ефективният начин за достъп до данните от екземпляр на шаблон е да направите следното:

<template is="dom-repeat" items="[[someParam]]">
  <paper-button on-tap="_handleTap">...</paper-button>
</template>

...

_handleTap: function(e) {
  var model = e.model.item;
  // Do something
}
person Ricky    schedule 10.09.2015
comment
Страхотно! Благодаря Рики! Това е много по-добър подход. Забележка за другите: Използвайки .model, както Рики обясни, успях да получа цялата структура от данни на {{item}} (като обект) от dom-repeat (което всъщност е това, което Исках да направя така или иначе.) - person Sean; 14.09.2015

arrow_upward
2
arrow_downward

За да се свържете с естествен атрибут като data-*, ще трябва да използвате атрибут-binding ($=). Що се отнася до пренасочването на събития, ще трябва да използвате Polymer.dom(event).localTarget, за да стигнете до правилната цел, излъчваща това събитие, в този случай вашия бутон за хартия (rootTarget също ще върне материал за хартия).

Ето работещ пример, който направих. http://jsbin.com/fehene/edit?html,output

person Neil John Ramal    schedule 10.09.2015
comment
data-attr също може да бъде достъпен чрез elem.dataset.attr. - person Neil John Ramal; 10.09.2015
comment
Работи като чар. - person Abhilash; 06.02.2017

arrow_upward
0
arrow_downward

След известно хакване се оказва, че свойството dataHost на целта сочи към оригиналния докоснат елемент. Не знам защо това не е документирано. Може да е ненадеждно, но работи за мен.

event.target.dataHost.args

АКТУАЛИЗАЦИЯ: Горното в крайна сметка не работи

уф Все още хаквам.

АКТУАЛИЗАЦИЯ: Оказва се, че трябва да сравните атрибутите на данните.

event.target.dataHost.dataArgs

Супер заплетен и скрит :-/

person Sean    schedule 09.09.2015
comment
this обикновено се отнася до елемента за повишаване на делегирани събития, може да е по-малко измислен... - person dandavis; 10.09.2015
comment
Дан, не съм сигурен какво имаш предвид с това. В рамките на функцията за манипулиране тази препратка сочи към елемента Polymer, който в този случай е родителски елемент/контейнер. Ще актуализирам въпроса, така че да е по-ясен, в случай че това помогне да се открие решение. - person Sean; 10.09.2015