与 DOM 的聚合物数据绑定

Question

我的聚合物成分定义如下：

<link rel="import" href="../../bower_components/polymer/polymer.html">
<dom-module id="add-money">
    <template>
    <style></style>
        <paper-dialog id="add-money-dialog" modal >
            <h2>Add money</h2>
            <paper-dialog-scrollable>
                <div>
                    <span>{{account.name}}</span>
                </div>
            </paper-dialog-scrollable>
            <div class="buttons">
                <paper-button dialog-dismiss>Cancel</paper-button>
                <paper-button dialog-confirm autofocus>Add</paper-button>
            </div>
        </paper-dialog>
    </template>
    <script>    
        var AddMoney = Polymer({
            is: 'add-money',
            properties: {
                account: {
                    type: Object,
                    notify: true,
                }
            },
            factoryImpl: function(acc) {
                this.account=acc;

            },
            showPopup:function(){
                console.log(JSON.stringify(this.account));
                var dialog = document.getElementById("add-money-dialog");
                if (dialog) {
                    dialog.open();
                }
            }
        });
    </script>
</dom-module>

现在，我实例化它并在单击另一个组件的按钮时将其添加到正文中。

        addMoney:function(e){
            var button = e.target;
            var dialog = new AddMoney(e.model.item);
            document.body.appendChild(dialog);
            dialog.showPopup();
        }

在执行此操作时，我能够在 showPopup 方法中看到可用的数据，但在 DOM.

好奇，可能是什么问题以及解决方法是什么。我是新手，正在尝试编写一些基于组件的代码来理解聚合物。请就此提出建议。提前致谢。

Answer 1

实际上是样式问题。我认为该值不会出现，因为没有显示任何内容。但它实际上是隐藏的，我看不到它。我在 paper-dialog-scrollable 添加了一些样式，现在我可以看到这些值了。

与 DOM 的聚合物数据绑定

Polymer-Data binding with DOM

polymer-1.0