如何使用淘汰赛 js 映射插件将从服务器端收到的 json 数组响应绑定到视图？接收到的数据与我在此处显示的完全一样，我无法控制更改服务器返回的内容。这是我的 JSFiddle。
我的代码如下所示：
Javascript
var data =
[{"street":"2532 Falkark Dr", "lat":"39.926295", "lng":"-86.012919", "zipcode":"92256"}, {"street":"8558 Appleby Ln", "lat":"39.922742", "lng":"-86.017637", "zipcode":"92256"},{"street":"8537 Rock Hollow Car", "lat":"39.916740", "lng":"-86.017043", "zipcode":"92256"},{"street":"8882 Powderhorn Way", "lat":"39.923866", "lng":"-86.012018", "zipcode":"92256"},{"street":"8820 Starrup Ct", "lat":"39.915676", "lng":"-86.023990", "zipcode":"92256"},{"street":"8545 Woodstone Ct", "lat":"39.915650", "lng":"-86.017014", "zipcode":"92256"},{"street":"8830 Burwack Dr", "lat":"39.924993", "lng":"-86.013454", "zipcode":"92256"},{"street":"8613 Appleby Ln", "lat":"39.921938", "lng":"-86.016539", "zipcode":"92256"},{"street":"8722 Gunpowder Ct", "lat":"39.916807", "lng":"-86.014584", "zipcode":"92256"},{"street":"7888 Beanblossom Car", "lat":"39.904030", "lng":"-86.029995", "zipcode":"92256"},{"street":"2172 Hadway Dr", "lat":"39.921560", "lng":"-86.017160", "zipcode":"92256"},{"street":"2118 Hardwood Ct", "lat":"39.920002", "lng":"-86.046934", "zipcode":"92250"},{"street":"8116 Teel Way", "lat":"39.903596", "lng":"-86.021409", "zipcode":"92256"},{"street":"8232 Castle Farms Rd", "lat":"39.907012", "lng":"-86.026124", "zipcode":"92256"},{"street":"2473 Colony Poante East Dr", "lat":"39.925350", "lng":"-86.049030", "zipcode":"92250"},{"street":"2302 Andaron Ct", "lat":"39.922920", "lng":"-86.048216", "zipcode":"92250"},{"street":"8135 Summertree Ct", "lat":"39.911729", "lng":"-86.024716", "zipcode":"92256"},{"street":"8626 Kruggle Ct", "lat":"39.914703", "lng":"-86.016291", "zipcode":"92256"},{"street":"8475 Wakefaeld Ct", "lat":"39.910430", "lng":"-86.032006", "zipcode":"92256"},{"street":"2416 Haddangton Dr W", "lat":"39.924718", "lng":"-86.015856", "zipcode":"92256"},{"street":"8461 Praarie Dr", "lat":"39.909595", "lng":"-86.026840", "zipcode":"92256"},{"street":"8328 Praarie Dr", "lat":"39.908163", "lng":"-86.026972", "zipcode":"92256"},{"street":"7251 Sprangwater Dr W", "lat":"39.900045", "lng":"-86.026943", "zipcode":"92256"},{"street":"2171 Andaron Dr", "lat":"39.921336", "lng":"-86.048979", "zipcode":"92250"},{"street":"8613 Quarterhorse Dr", "lat":"39.913344", "lng":"-86.023906", "zipcode":"92256"},{"street":"8812 Champaons Dr", "lat":"39.915806", "lng":"-86.022538", "zipcode":"92256"},{"street":"8556 Honeysuckle Way", "lat":"39.912083", "lng":"-86.019654", "zipcode":"92256"},{"street":"8475 Summertree Ln", "lat":"39.911031", "lng":"-86.026843", "zipcode":"92256"},{"street":"8511 Castle Radge Ln", "lat":"39.910708", "lng":"-86.030860", "zipcode":"92256"},{"street":"8112 Stonebranch East Dr", "lat":"39.903251", "lng":"-86.029115", "zipcode":"92256"}]
function ViewModel() {
var self = this;
self.addresses = ko.observableArray([]);
ko.mapping.fromJS(data, {}, self.addresses);
}
var viewModel = new ViewModel();
//function binding work order details to view
$(document).ready(function () {
ko.applyBindings(viewModel);
});
html
<h3>Knocked Out</h3>
<table class="table table-condensed">
<thead>
<tr>
<th class="span2">Address</th>
<th class="span1">Latitude</th>
<th class="span3">Longitude</th>
<th class="span3">Zip Code</th>
</tr>
</thead>
<tbody data-bind="foreach: addresses">
<tr>
<td data-bind="text: street"></td>
<td data-bind="text: lat"></td>
<td data-bind="text: lng"></td>
<td data-bind="text: zipcode"></td>
</tr>
</tbody>
</table>
非常感谢任何帮助。