Javascript 从聚合元素返回简单值？

我已经成功地使用核心ajax来传递json对象，但我想编写一个可以传递简单值的自定义元素。这是我所拥有的，但它不起作用

测试输出元素

<link rel="import" href="../polymer/polymer.html">
<polymer-element name="testOutput">
    <template>
        This doesn't do anything but output a value.
    </template>
    <script>
        Polymer('testOutput', {
            response: "MyValue"
        });
    </script>
</polymer-element>

<link rel="import" href="../polymer/polymer.html">
<polymer-element name="testInput" noscript attributes="input">
    <template>
        Here is the value from the other element:
        <h1>{{input}}</h1>
    </template>
</polymer-element>

这除了输出一个值之外什么都不做。
聚合物（“测试输出”{
答复：“我的价值”
});

测试输入元素

<link rel="import" href="../polymer/polymer.html">
<polymer-element name="testOutput">
    <template>
        This doesn't do anything but output a value.
    </template>
    <script>
        Polymer('testOutput', {
            response: "MyValue"
        });
    </script>
</polymer-element>

<link rel="import" href="../polymer/polymer.html">
<polymer-element name="testInput" noscript attributes="input">
    <template>
        Here is the value from the other element:
        <h1>{{input}}</h1>
    </template>
</polymer-element>

以下是来自其他元素的值：
{{input}}

index.html

<testOutput response="{{output}}"></testOutput>
<testInput input="{{output}}"></testInput>

输出

<link rel="import" href="../polymer/polymer.html">
<polymer-element name="testOutput">
    <template>
        This doesn't do anything but output a value.
    </template>
    <script>
        Polymer('testOutput', {
            response: "MyValue"
        });
    </script>
</polymer-element>

<link rel="import" href="../polymer/polymer.html">
<polymer-element name="testInput" noscript attributes="input">
    <template>
        Here is the value from the other element:
        <h1>{{input}}</h1>
    </template>
</polymer-element>

这除了输出一个值之外什么都不做

以下是来自其他元素的值：

---

我认为你的回答应该是一个函数

Polymer('testOutput', {
        response: function() { return "MyValue" };
    });

---

我只需要在输出元素中发布响应变量。可以通过将其包含在属性中或使用“发布”功能来实现这一点

<polymer-element name="testOutput" attributes="response">

---

我认为有两种方法

第一条路

您需要创建要在其中获取数据的元素：

聚合物（“第一元素”{
needPass：“我通过了”
});

在您需要使用querySelector获取第一个元素并获取数据之后

<link rel="import" href="../../bower_components/polymer/polymer.html">

<polymer-element name="second-element">
    <template>
        <style>
            :host{
                width: 100%;
                height: 100%;
            }
        </style>
        <h1>{{passed}}</h1>
    </template>
    <script>
    Polymer('second-element',{

        passed: '',
        ready: function(){

            var first_el = document.querySelector('first-element');
            this.passed = first_el.needPass;
        }
    });
    </script>
</polymer-element>

：主持人{
宽度：100%；
身高：100%；
}
{{passed}}
聚合物（“第二元素”{
已通过：“”，
就绪：函数（）{
var first_el=document.querySelector（'first-element'）；
this.passed=第一个通行证；
}
});

然后将元素调用到索引中

<first-element></first-element>
<second-element></second-element>

第二种方式

或者可以将第一个元素调用到第二个元素中

<link rel="import" href="../../bower_components/polymer/polymer.html">

<link rel="import" href="first-element.html">

<polymer-element name="second-element">
    <template>
        <style>
            :host{
                width: 100%;
                height: 100%;
            }
        </style>
        <first-element needPass="{{needPass}}"></first-element>
        <h1>{{needPass}}</h1>
    </template>
    <script>
    Polymer('second-element',{
        ready: function(){
        }
    });
    </script>
</polymer-element>

第一个要素：

<link rel="import" href="../../bower_components/polymer/polymer.html">

<polymer-element name="first-element" attributes="needPass">
    <template>

    </template>
    <script>
    Polymer('first-element',{
        needPass: 'I am Passed'
    });
    </script>
</polymer-element>

聚合物（“第一元素”{
needPass：“我通过了”
});

第二要素

<link rel="import" href="../../bower_components/polymer/polymer.html">

<link rel="import" href="first-element.html">

<polymer-element name="second-element">
    <template>
        <style>
            :host{
                width: 100%;
                height: 100%;
            }
        </style>
        <first-element needPass="{{needPass}}"></first-element>
        <h1>{{needPass}}</h1>
    </template>
    <script>
    Polymer('second-element',{
        ready: function(){
        }
    });
    </script>
</polymer-element>

：主持人{
宽度：100%；
身高：100%；
}
{{needPass}}
聚合物（“第二元素”{
就绪：函数（）{
}
});

并只调用索引中的第二个元素

<link rel="import" href="../../bower_components/polymer/polymer.html">

<link rel="import" href="first-element.html">

<polymer-element name="second-element">
    <template>
        <style>
            :host{
                width: 100%;
                height: 100%;
            }
        </style>
        <first-element needPass="{{needPass}}"></first-element>
        <h1>{{needPass}}</h1>
    </template>
    <script>
    Polymer('second-element',{
        ready: function(){
        }
    });
    </script>
</polymer-element>

我希望这对你有帮助

---

PS：我测试了代码。

请看这篇文章：我应该注意我使用的是自动绑定模板。很抱歉