我有一个Polymer的问题..这个组件是一个列表框的详细信息。单击该行时,ajax调用获取数据并调用details.setItems(data)函数。 console.log在函数调用的每个地方显示this.item,数据在变量中,一切都很好,只是GUI没有刷新。也许绑定不起作用?我该怎么办?
<polymer-element name="cegnyilvantarto-details" extends="base-details">
<template>
<page-structure dialog="{{dialog}}" flex style="height:100%">
<div left-top>
<table>
<td>
<tr>
<td>
<core-label for="#id">Azonosító:</core-label>
</td>
<td>
<paper-input id="id" disabled="true" value="{{item[0].id}}" style="text-align:center"></paper-input>
</td>
</tr>
<tr>
<td>
<core-label for="#name">Rendszám:</core-label>
</td>
<td>
<paper-input id="name" value="{{$.item[0].name}}"></paper-input>
</td>
</tr>
<tr>
<td>
<core-label for="#address">Gyártó:</core-label>
</td>
<td>
<paper-input id="address" value="{{$.item[0].address}}"></paper-input>
</td>
</tr>
<tr>
<td>
<core-label for="#phone">Telefonszám:</core-label>
</td>
<td>
<paper-input type="phone" id="phone" value="{{item[0].phone}}"></paper-input>
</td>
</tr>
<tr style="padding-bottom:30px;">
<td>
<core-label for="#contactname">Kapcsolattartó:</core-label>
</td>
<td>
<paper-input id="contactname" value="{{item[0].contactname}}"></paper-input>
</td>
</tr>
<tr style="padding-bottom:30px;">
<td>
<core-label for="#contactphone1">Telefonszám 1:</core-label>
</td>
<td>
<paper-input id="contactphone1" value="{{item[0].contactphone1}}"></paper-input>
</td>
</tr>
<tr style="padding-bottom:30px;">
<td>
<core-label for="#contactphone2">Telefonszám 2:</core-label>
</td>
<td>
<paper-input id="contactphone2" value="{{item[0].contactphone2}}"></paper-input>
</td>
</tr>
<tr style="padding-bottom:30px;">
<td>
<core-label>Cégcsoport:</core-label>
</td>
<td>
<me-combobox id="cgroupsCombobox" width="250"></me-combobox>
</td>
<td>
</td>
<td>
</td>
</tr>
</td>
</table>
</div>
<div left-bottom flex style="height:100%">
<div layout vertical flex style="min-height:140px;">
<core-label style="margin-top:10px;" for=" #comment ">Megjegyzés</core-label>
<paper-shadow z=1 flex style="width:100%; padding:10px; margin-top:10px; ">
<paper-autogrow-textarea flex style="width:100%; ">
<textarea id="comment " flex style="width:100%; " value="{{item[0].comment}} "></textarea>
</paper-autogrow-textarea>
</paper-shadow>
</div>
</div>
<div right-top>
<core-field>
</core-field>
</div>
<div right-bottom>
{{item | json}}
</div>
<div bottom-bar>
<paper-button style="margin-left:15px;margin-bottom:15px;margin-top:5px; " self-start>Save</paper-button>
</div>
</page-structure>
<core-ajax id="ajaxCGroupsCombobox" method="POST" handleAs="json" on-core-response="{{onCGroupsResponse}}"></core-ajax>
</template>
<script>
Polymer('cgroups-details', {
init: function () {
this.getCGroupsCombobox();
},
ready: function () {
this.super();
},
setItems(item) {
this.$.item = item;
this.init();
console.log("IDEJUTOTT");
},
getCGroupsCombobox: function () {
var ajax = this.$.ajaxCGroupsCombobox;
ajax.body = this.getComboboxBody();
ajax.url = this.getServerAddress('get', 'cgroups');
ajax.go();
},
onCGroupsResponse: function (event, response) {
var res = response.response.res;
var vehicles = [];
//console.log(res);
for (var i = 0; i < res.length; i++) {
var vehicle = {};
vehicle.text = res[i].name;
vehicle.id = res[i].id;
vehicle.name = res[i].name;
vehicle.comment = res[i].comment;
vehicles.push(vehicle);
// console.log(vehicle);
}
console.log(vehicles);
this.$.cgroupsCombobox.setItems(vehicles);
},
});
</script>
</polymer-element>
答案 0 :(得分:0)
在聚合物绑定中,使用点表示法访问数组索引。
<paper-input id="id" disabled="true" value="{{item.0.id}}" style="text-align:center"></paper-input>