2017-01-14 4 views
0

私はバックエンドにNodeとMySQLを、フロントエンドにPolymerを使用しています.PolymerにJSON配列を描画させることができません。ノードとMySQLを持つPolymerがJSONを認識しない

ノード/ MySQLのコード

var mysql  = require('mysql'); 
var connection = mysql.createConnection({ 
    host  : 'localhost', 
    user  : 'root', 
    database : 'test' 
}); 
connection.connect(); 



connection.query('SELECT * FROM ACTIVITY', function(err, rows, fields) { 
    if (err) { 
    console.error('error connecting: ' + err.stack); 
    return; 
    } 
    json = JSON.stringify(rows); 
    console.log(json); 
}); 

connection.end(); 

ポリマーフロントエンド

<paper-dropdown-menu label="Activity Selection"> 
    <iron-ajax 
    id="getActivity" 
    auto 
    url="scripts/dbcon.js" 
    handle-as="json" 
    on-response="handleResponse" 
    last-response="{{ajaxResponse}}"> 
    </iron-ajax> 
    <paper-listbox class="dropdown-content"> 
    <template is="dom-repeat" items="[[ajaxResponse]]"> 
     <paper-item><b>{{item.ACTIVITY_NAME}}</b></paper-item> 
    </template> 
    </paper-listbox> 
</paper-dropdown-menu> 

JSON出力

[{"ID":1,"ACTIVITY_NAME":"Coffee"},{"ID":2,"ACTIVITY_NAME":"Gym"},{"ID":3,"ACTIVITY_NAME":"Lunch"},{"ID":4,"ACTIVITY_NAME":"Vending Machine"},{"ID":5,"ACTIVITY_NAME":"Pool"}] 

私はTHIを実行すると、 sコマンド:node dbcon.jsconsole.logの出力は、上記のJSON配列です。

何らかの理由により、PolymerがJSON配列を認識していません。 Chrome DevToolsコンソールにエラー/出力はありませんでした。

別のテストシナリオでは、手動でJSON配列の出力をファイルにコピーし、のパラメータをurlから"scripts/test.json"に変更し、電子アプリをリロードしました。 PolymerはドロップダウンリストにJSONコンテンツを表示できました。

答えて

1

<iron-ajax>.urlプロパティは、要求のURLターゲットを指定するためのものです。それはあなたが期待しているように思われるJavaScript(<script>タグのような)として応答を実行しません。

<iron-ajax>scripts/dbcon.jsの内容を読み込み、それをJSONとして解析しようとしています(handle-as="json"のため)。解析が失敗し、結果としてnullという応答値が返されます。

この問題を解決するには、<iron-ajax>.urlに、JSON応答を提供しているノードサーバーのURLを設定する必要があります。

+0

入力していただきありがとうございます。 – blitz

+0

@blitz問題なし:) – tony19

+0

*編集を続行 入力と情報ありがとうございます。今私はサーバーを使用していませんが、json.stringifyを使ってjsonに変換したクエリ結果を抽出し、実際のjsonデータを渡したり解析したりすることは可能ですか? 将来、私はこれを実際のサーバーに展開している可能性があります。 – blitz

関連する問題