2016-10-12 1 views
-1

Я работаю в первый раз с элементом Polymers iron-ajax и столкнулся с проблемой, которую, я считаю, довольно просто решить, но я не могу найти решение онлайн.
Сохранение возвращаемых значений из запроса iron-ajax в переменных (Polymer)

Я извлекаю детали пользователя с помощью элемента iron-ajax и прокручиваю его с помощью dom-repeat. Первое и последнее имя пользователя помещаются в пользовательский элемент карты, который я создал для отображения пользователей. Все работает отлично, за исключением того, что я не могу сохранить возвращаемое значение id в переменной. Я уверен, что это возможно с использованием привязки данных, но я не мог заставить его работать. И даже когда я пытаюсь получить значение с помощью getAttribute в моем JavaScript, он просто возвращает null.

В коде ниже мой ответ запрос железодефицитной Аякса & можно найти в том числе и моей неуклюжей попытке получить значение идентификатора {{item.id}}. Для этого я создал функцию на-кране, когда пользователь нажимает на одной из карт, которые затем должны получить значение атрибута stdId.

<dom-module id="my-students-view"> 
<template> 

    <style> 
    :host { 
     display: block; 
    } 
    </style> 

    <!-- Iron-Ajax created connection and gets data --> 
    <iron-ajax 
    auto 
    id="requestRepos" 
    url="http://api.dev/user/" 
    handle-as="json" 
    loading="{{isloading}}" 
    last-response="{{response}}"></iron-ajax> 

    <!-- dom-repeat iterates the response --> 
    <template is="dom-repeat" items="[[response.data]]" sort="sortData"> 
    <student-card 
     id="studentCard" 
     to="http://localhost:8080/profile-view/{{item.id}}" 
     picsrc="../../images/anonymous.jpg" 
     name="{{item.first_name}} {{item.last_name}}" 
     stdId="{{item.id}}" 
     on-tap="sendId"></student-card> 

    </template> 
</template> 

<script> 
Polymer({ 
    is: 'my-students-view', 

    properties: { 
    stdId: { 
     notify: true, 
    } 
    }, 

    //Sort the array/data alphabetically 
    sortData: function(a, b) { 
    if(a.first_name < b.first_name) return -1; 
    if(a.first_name > b.first_name) return 1; 
    return 0; 
    }, 

    //Try to get the id value of a the student card 
    sendId: function() { 
    var idPropertie = this.$$("#studentCard"); 
    var idValue = idPropertie.getAttribute('stdId'); 
    console.log('the id is:' + idValue); 
    }, 

}); 

</script> 
</dom-module> 

ответ

1

Перепишите sendId функции:

sendId: function(event) { 
    var idValue = event.model.item.id; 
    console.log('the id is:' + idValue); 
}, 
+0

Большое спасибо @Patricklaf !!! Есть ли какая-либо документация, которая объясняет, почему я могу получить к ней доступ только через event.model ?? – Niklas

+1

Документация находится здесь: https://www.polymer-project.org/1.0/docs/devguide/templates#handling-events – Patricklaf