Question

我有一个聚合物网络应用程序连接到firebase数据库。我已经成功地将数据存储到我的数据库中并从中检索数据。我试图在Firebase forEach（）方法期间将div添加到dom模块，同时从数据库解析我的JSON数据。我收到此错误，我不确定如何附加到我的HTML代码。

错误消息显示：＆＃34;用户回调引发了异常。 TypeError：无法执行＆＃39; appendChild＆＃39; on＆＃39;节点＆＃39;：参数1不属于＆＃39;节点＆＃39;。＆＃34;

这是引发错误的行：

Polymer.dom(container).appendChild('<div class="card">' + data.name + '</div>');

以下是代码的其余部分，以提供更多关于我想要实现的内容的上下文：

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

<dom-module id="my-list-view1">

    <template>
        <style>

            .cardContainer {
            }

            .card {
                box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2);
                padding-bottom: 16px;
                margin: 24px;
                border-radius: 5px;
                background-color: #fff;
                color: #757575;
            }

        </style>
        <div id="cardContainer">
            <paper-fab icon="arrow-forward" on-click="_loadJson"></paper-fab>
        </div>


    </template>
    <script>
        Polymer ({
            is: 'my-list-view1',
            _loadJson: function() {
                var ref = new Firebase("https://firebaseurl.com/entries");
                var container = this.$.cardContainer;
                ref.on("value", function(snapshot) {
                    snapshot.forEach(function(childSnapshot) {
                        var data = childSnapshot.val();
                        console.log(data.name + " " + data.phone);
                        Polymer.dom(container).appendChild('<div class="card">' + data.name + '</div>'); //error here
                    });
                });
            }
        })

    </script>

</dom-module>

数据检索完美，我可以解析JSON对象，但是我不知道如果有数据，如何附加到这个dom-module。我真的想把每个json对象的div添加到名为cardContainer的div中。非常感谢所有帮助，提前致谢。

Answer 1

我在这个问题上跳了起来。您必须使用函数document.createElement（），然后将其附加到您想要的父视图中：

现在是我的_loadJson函数：

_loadJson：function（）{

var ref = new Firebase("https://firebaseurl.com/entries");
                var container = this.$.cardContainer;
                ref.on("value", function(snapshot) {
                    snapshot.forEach(function(childSnapshot) {
                        var data = childSnapshot.val();
                        console.log(data.name + " " + data.phone);
                        var card = document.createElement('div');
                        card.className = "card";
                        card.innerHTML = data.name + ", " + data.phone;
                        Polymer.dom(container).appendChild(card);
                    });
                });
            }

抱歉，如果这是重复的，那么此处有相同问题的其他人就是解决方案。

使用Polymer函数附加到div

1 个答案: