Bigode JS Template com Coleção JSON
Oi, esta é minha primeira tentativa de usar o MustacheJS com um webservice JSON no .net
Atualmente estou com dificuldades Não consigo encontrar o que estou fazendo errado configurando este exemplo básico:
Meu Webservice está retendo a seguinte string:
[
{
"ShortDescription":"BOX",
"Description":"BOXING",
"Id":1
},
{
"ShortDescription":"EPL",
"Description":"ENGLISH PREMIER LEAGUE",
"Id":2
}
]
Eu validei sua sintaxe com este website:http://json.parser.online.fr/
e aqui está o código HTML que estou usando:
google.load("jquery", "1");
google.setOnLoadCallback(function () {
$(document).ready(
function () {
$.ajax({
url: "../data.asmx/geteagues",
type: "POST",
dataType: "json",
data: "",
contentType: "application/json; charset=utf-8",
success: function (data) {
var template = "<h1>{{ShortDescription}} {{Description}}</h1>";
var html = Mustache.render(template, data);
$('#sampleArea').html(html);
alert(html);
}
})
}
)
});
Estou postando todo o código JS, já que não sou muito bom com javascript, basicamente eu quero carregar sempre a última versão do JQuery do google e depois trabalhar minha chamada WS.
O problema até agora é que quando eu coloco um ponto de interrupção na seguinte linha:
var html = Mustache.render(template, data);
Eu vejo que o template está setn ok, assim como os dados, o mesmo valor que eu postei acima, mas a função .render está retornando:
Parece que não gostou dos dados.Até agora, todos os exemplos que vi para dados inline vêm como a seguinte estrutura:
{
"repo": [
{ "name": "resque" },
{ "name": "hub" },
{ "name": "rip" },
]
}
E então um modelo definido assim:
{{#repo}}
<b>{{name}}</b>
{{/repo}}
Mas a única diferença disso contra os meus dados é que eu não tenho um "pai" como "repo"
No lado do servidor, estou usando uma biblioteca .net chamada JSON.net e na documentação de como as coleções estão sendo serializadas:
james.newtonking.com/projects/json/help/html/SerializingCollections.htm
o resultado final não inclui o nome do nó pai, o que eu acho que está faltando na minha definição de modelo de bigode:
[
{
"Name": "Product 1",
"ExpiryDate": "2000-12-29T00:00Z",
"Price": 99.95,
"Sizes": null
},
{
"Name": "Product 2",
"ExpiryDate": "2009-07-31T00:00Z",
"Price": 12.50,
"Sizes": null
}
]
É isso que estou perdendo? o nó pai "repo" dos meus dados para que eu possa iterar meu modelo?
Agradeço antecipadamente pelo seu tempo.
-ed