JSFiddle - React, Tailwind, and code Playground
by infatti
HTML
<script src="http://ajax.aspnetcdn.com/ajax/knockout/knockout-2.2.1.js"></script>
<script src="https://raw.github.com/SteveSanderson/knockout.mapping/master/build/output/knockout.mapping-latest.js"></script>
<ul>
<li><!-- item -->
<!-- number -->
<h4 data-bind="text: Number"></h4>
<!-- type -->
<h4data-bind="text: Type"></h4>
<!-- task -->
<h4 data-bind="text: Task"></h4>
<!-- project number -->
<h4 data-bind="text: ProjectNumber"></h4>
</li><!-- #item -->
</ul>
<hr />
<h2>json</h2>
{
"WorkflowItemViewModels":[
{
"WorkflowItem":{
"Number":111,
"Type":"firstType",
"Task":"firstTask",
"ProjectNumber":"555",
},
"WorkflowItem":{
"Number":222,
"Type":"secondType",
"Task":"secondTask",
"ProjectNumber":"888",
}
]
}
JavaScript
// Here's my data model
var viewModel;
$.getJSON('/myJsonData', function (data) {
viewModel = ko.mapping.fromJS(data);
ko.applyBindings(viewModel);
});