聚合物.js嵌套组件中的数据绑定

Polymer.js databindings inside nested components

本文关键字:数据绑定 组件 js 嵌套 聚合物      更新时间:2023-09-26

我有一个聚合物元素,它是我整个应用程序的父元素。它例行执行 ajax 调用,并根据 AJAX 调用设置值。

在聚合物元素中,我有一个子元素,需要动态显示这些值之一。

这是子代码:

<polymer-element name="main-status" attributes="auto">
    <template>
        <div id="status" flex>
            <div id="info" middle>
                <p>Robot is in {{ auto ? "AUTO" : "MANUAL T1" }} mode.</p>
            </div>
        </div>
        <link rel="stylesheet" type="text/css" href="main-status.css">
    </template>
    <script src="main-status.js"></script>
</polymer-element>

它在父级中用于:

<main-status auto="{{statusAuto}}"></main-status>

并且{{statusAuto}}被确认会发生变化(在真和假之间)。此更改不会反映在子元素中。我同样尝试使用聚合物网站上建议的单态模式绑定到全局变量,但我仍然没有成功。

如何实现这一点?

<main-status auto="{{statusAuto}}></main-status>

错过了结束语 - 应该是

<main-status auto="{{statusAuto}}"></main-status>

如果这只是问题而不是您的实际代码,请尝试

<main-status auto="{{statusAuto}}">{{statusAuto}}</main-status>

并验证statusAuto是否正确更新了该值。