Unable to render full JSON object graph with Mustache template using Nustache
-
26-10-2019 - |
Question
I have a simple JSON object graph I'm trying to render using a Mustache template in an ASP.NET MVC 3 site using Nustache
(Nustache.Core
and Nustache.Mvc
).
My object graph represents a simple list of Franchises, each has one or more owners (if active and operating) and each owner contains a Name object with First, Last, Middle, Suffix, Title:
{
"Count": 39,
"Franchises": [
{
"Id": "81e5e91b-37eb-4f60-ac5f-d2d9a2c1b8fc",
"Name": "My Franchise, Inc.",
"Number": "001",
"Owners": [],
"Status": {
"Id": 4,
"Name": "Terminated"
}
},
{
"Id": "98887526-5b1d-4db9-9ddb-2be2cd6af957",
"Name": "My Other Franchise, Inc.",
"Number": "0002",
"Owners": [
{
"Id": "cffd8de3-aa12-4dbf-b129-0886aea7d1b1",
"Name": {
"FirstName": "James",
"LastName": "Drew",
"MiddleName": null,
"Suffix": null,
"Title": null
}
}
],
"Status": {
"Id": 2,
"Name": "Operating"
}
}.
...
]
}
My MVC action method is very simple. Uses a WebClient
to grab the JSON from the service and the JavaScriptSerializer
to convert the JSON to a dictionary and passes that to the view:
public ActionResult Index()
{
var json = null as String;
var serializer = new System.Web.Script.Serialization.JavaScriptSerializer();
using (var client = new System.Net.WebClient())
{
json = client.DownloadString(@"http://my.service.com/franchises");
}
return PartialView(serializer.Deserialize<Dictionary<string, object>>(json));
}
And here is my basic Mustache template:
<ul>
{{#Franchises}}
<li><a id="{{Id}}" href="/franchises/details/{{Id}}">{{Number}}</a>
{{#Owners}}
TODO: Print Name Here
{{/Owners}}
</li>
{{/Franchises}}
</ul>
The problem I'm having is printing the name of each owner. The template renders everything but the owner's name and I've tried several template variations with no luck; replacing TODO: Print Name Here
with:
{{Name}}
prints outSystem.Collections.Generic.Dictionary'2[System.String,System.Object]
for each owner object{{#Name}}{{FirstName}} {{LastName}}{{/Name}}
prints blank{{> Name}}
that points to a template with{{#Name}}{{FirstName}} {{LastName}}{{/Name}}
or{{FirstName}} {{LastName}}
both print blankBoth
{{Name.FirstName}}
or{{Name/FirstName}}
print blank
I don't know what else to try. It can't be this difficult to navigate through an object graph. Can someone please let me know what I'm doing wrong?
Solution
The problems I'm having are definitely within Nustache as pointed out by Gazler in the comments. Unfortunately, I can't seem to find any other implementations of Mustache in .NET so I'll probably have to roll my own (or at least add to Nustache) to enable the expected functionality.