Question

我已经深入研究了聚合物的ajax核心元素，如下所示的代码工作正常：

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

在这种情况下，我可以从{{resp}}获取值。我深入研究了core-ajax源代码，并了解它是如何完成的：

通过设置response

attributes="response ..."

将ajax回复传递给this.response

然后我尝试构建自己的ajax组件，但它没有用，我的ajax组件代码是：

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();
  }
});

我的应用代码是：

<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}}" />

结果是ajax请求已成功完成，但输入的值是“{{response}}”，而不是{{response}}的值，所以我认为我对如何理解发布的属性工作，有什么帮助？ THK。

Answer 1

我知道你说你弄清楚了，但是对于其他人来到这个页面寻找一个完整的解决方案和解释，就在这里。

如果您想要数据绑定而无需创建自定义元素，则必须将代码放入模板中，is属性设置为auto-binding：

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

如果没有这个，Polymer不知道它需要在你的html中连接绑定，像{{resp}}这样的东西将被视为文本。

可在此处找到更详细的说明：http://www.polymer-project.org/docs/polymer/databinding-advanced.html#autobinding

对聚合物公布的属性感到困惑

1 个答案: