私はMustache.jsと、次のフィドルを列挙して構築しようとしていますJSONPと口ひげJavaScriptのテンプレート

Question

とオブジェクト内のセクションの上に列挙に失敗：ここ

$(function() { 
    var choices = { "users": [ 
     { "first_name": "Ryan", 
      "last_name": "Pays", 
      "pic_square": "/Global/profile/thumb/placeholder.jpg", 
      "product_name": "Merlin - the complete box set", 
      "product_picture": "/Global/products/full/box-set.jpg" 
     }, 
     { "first_name": "Eric", 
      "last_name": "Li Koo", 
      "pic_square": "/Global/profile/thumb/placeholder.jpg", 
      "product_name": "Merlin - Series 4 volume 1", 
      "product_picture": "/Global/products/full/box-set.jpg" 
     }, 
     { "first_name": "Abdul", 
      "last_name": "Raouf", 
      "pic_square": "/Global/profile/thumb/placeholder.jpg",  
      "product_name": "Merlin - the complete box set", 
      "product_picture": "/Global/products/full/box-set.jpg" 
     }] 
    }; 
    $.getJSON("http://jsfiddle.net/echo/jsonp/?callback=?", choices, function (data) { 
     console.log(data); 
     var template = "<ul>{{#users}}" + 
         "<li>" + 
      "<p><strong>{{first_name}} {{last_name}}</strong> likes {{product_name}}</p>" + 
         "</li>" + 
         "{{/users}}</ul>", 
      html = Mustache.to_html(template, data); 
     $('.wrapper').html(html); 
    }); 
}); 

例 - >http://jsfiddle.net/mhMJA/3/

それは正しく記録されますJSONの応答はコンソールに表示されますが、テンプレートをビルドできません。私はJSONPコールバックに単一のユーザーを渡すだけでうまくいきます。

ありがとうございます。

Answer 1

あなたの責任ではありません。 jsfiddleは、JSONオブジェクトを次の形式に変換するのに役立ちます。

{"users[0][first_name]":"Ryan","users[1][first_name]":"Eric","users[2][first_name]":"Abdul","users[2][product_picture]":"/Global/products/full/box-set.jpg","users[1][product_picture]":"/Global/products/full/box-set.jpg","users[1][pic_square]":"/Global/profile/thumb/placeholder.jpg","users[1][product_name]":"Merlin - Series 4 volume 1","users[0][last_name]":"Pays","users[0][product_picture]":"/Global/products/full/box-set.jpg","users[1][last_name]":"Li Koo","users[0][product_name]":"Merlin - the complete box set","users[0][pic_square]":"/Global/profile/thumb/placeholder.jpg","users[2][last_name]":"Raouf","users[2][pic_square]":"/Global/profile/thumb/placeholder.jpg","users[2][product_name]":"Merlin - the complete box set","_":"1326530878282"} 

この問題を回避するには、独自のJSONPアプリを作成することをおすすめします。 Here私はJSON2を使ってJSONオブジェクトを取り出しました。