JSFiddle - React, Tailwind, and code Playground

by Jeroen Heijmans

HTML

<script src="//cdnjs.cloudflare.com/ajax/libs/knockout.mapping/2.3.5/knockout.mapping.js"></script>
<div data-bind="foreach: $root">
    <div data-bind="text: $data[23].partition"></div>
</div>

JavaScript

var data = [{"23":{
     "partition":"Prod New SVCs Partition",
     "env_dc":"Prod",
     "hosts":["server01.domain.com", "server02.domain.com"],
     "vips":{
           "124":{
               "dc_endpoint":"ADX - Prod - Intranet",
               "gw_port":"9007",
               "vip_name":"adx-prd.domain.net"
                },
           "210":{
               "dc_endpoint":"Msg - Prod - Internet",
               "gw_port":"8013",
               "vip_name":"messaging-prd.domain.com"
                 },
           "211":{
               "dc_endpoint":"Msg - Prod - Intranet",
               "gw_port":"9013",
               "vip_name":"messaging-prd.domain.net"}
              },
          }
    }];

var vm = ko.mapping.fromJS(data);

ko.applyBindings(vm);