对聚合物发布的属性感到困惑答案

【问题标题】：confused about the polymer published attributes对聚合物发布的属性感到困惑
【发布时间】：2014-07-31 13:45:39
【问题描述】：

我已经深入研究了聚合物的 ajax-core 元素，如下代码可以正常工作：

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

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

通过设置attributes="response ..." 使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请求已经成功完成，但是input的值是“{{response}}”，而不是{{response}}的值，所以我觉得我理解的有问题已发布的属性有效，有帮助吗？谢谢。

【问题讨论】：

我自己搞定了，代码必须在<template>标签中，否则不起作用。我的应用代码不在任何模板中。

标签： polymer

【解决方案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

【讨论】：