/ / Confundido sobre los atributos publicados del polímero - polímero

Confundido sobre los atributos publicados del polímero - polímero

He excavado en el elemento ajax-core del polímero, el código como el siguiente funciona bien:

<core-ajax url="./ajax-test.txt" auto response="{{resp}}"></core-ajax>
<textarea value="{{resp}}"></textarea>

Puedo obtener el valor de {{resp}} en este caso. He profundizado en el código fuente de core-ajax y descubro cómo se ha hecho:

  1. hacer response un atributo publicado por configuración attributes="response ..."
  2. pasar la respuesta ajax a this.response

Luego intenté construir mi propio componente ajax pero no funcionó, mi código de componente ajax es:

Polymer("louis-ajax", {
url: "",
response: null,
ready: function() {
xmlhttp=new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
this.response = xmlhttp.responseText;
}
}.bind(this);
xmlhttp.open("GET",this.url,true);
xmlhttp.send();
}
});

y mi código de aplicación es este:

<louis-ajax url="http://polymer.snspay.cn/api/posts.json" response="{{response}}"></louis-ajax>
<span>We have got the ajax response as</span> : <input type="text" value="{{response}}" />

El resultado es que la solicitud de ajax ha sidohecho con éxito, pero el valor de la entrada es "{{respuesta}}", no el valor de {{respuesta}}, así que creo que hay algo incorrecto en cómo funciona la comprensión de los atributos publicados, ¿algo de ayuda? Thk.

Respuestas

5 para la respuesta № 1

Sé que dijiste que lo habías descubierto, pero para otros que vienen a esta página en busca de una solución y explicación que funcione completamente, aquí está.

Si desea el enlace de datos sin tener que crear un elemento personalizado, debe poner su código en una plantilla con el is atributo establecido en auto-binding:

<template is="auto-binding">
<core-ajax url="./ajax-test.txt" auto response="{{resp}}"></core-ajax>
<textarea value="{{resp}}"></textarea>
</template>

Sin esto, Polymer no sabrá que necesita conectar los enlaces en su html, y cosas como {{resp}} Será tratado como texto.

Una explicación más detallada se puede encontrar aquí: http://www.polymer-project.org/docs/polymer/databinding-advanced.html#autobinding