ポリマー機能を使用してdivに追加する

Question

私はfirebaseデータベースに接続されたポリマーウェブアプリを持っています。私は正常に私のデータベースとの間でデータを格納し、検索しました。私はデータベースからJSONデータを解析中にFirebase forEach（）メソッド中にdivモジュールを追加しようとしています。私はこのエラーが発生している、と私は本当に私のHTMLコードに追加する他の方法を確認していない。

エラーメッセージが言う：「例外がユーザーのコールバックによってスローされた例外TypeError：実行に失敗しました 『のappendChild』 『ノード』上：パラメータ1は 『ノード』タイプではありません。」

、これはエラーを投げているラインである：ここでは

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モジュールに追加する方法がわかりません。私は本当にすべてのjsonオブジェクトのdivをcardContainerというdivに追加しようとしています。すべての助けは大変感謝しています。ありがとうございました。

Answer 1

私はこの質問に対して銃を飛ばしました。あなたは（関数のdocument.createElementを使用する必要があります）、その後、あなたがそうのようにしたいという親ビューにそれを追加します。ここでは

は私の_loadJson機能は以下のようになります。

_loadJson：機能（）{

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); 
        }); 
       }); 
      } 

申し訳ありませんこれは重複していますが、ここで同じ問題が発生している他の誰かが解決策です。