Question

我有一个表单，我想使用来自JSON对象的knockout数据绑定来填充。我使用knockout对这些值进行了硬编码。我真正追求的是因为我有一个JSON对象如何将其转换成数据，淘汰赛可以用来动态填充我的表单？这是我的FIDDLE

 <p>Hero Name: <span data-bind="text : HeroName" /></p>
 <p>Agent Writing Number: <span data-bind="text : HeroCode" /></p>
 <p>Contact Phone:  <span data-bind="text : ContactPhone" /></p>


var HeroDetails = $.get("GetHeroDetailsForVillianView", {
                HeroRequestIdForvillianDetailsView: HeroRequestIdForVillianDetailsView
            }, function (returnDataForDetails) {
                var results = JSON.parse(returnDataForDetails);

   $('#json').text(JSON.stringify({HeroName:'PeterParker', ContactPhone: '123456', HeroCode: 3 }, null, 4));


 function ViewModel() {
var self = this;

 self.HeroName = ko.observable("Peter Parker");
        self.ContactPhone = ko.observable("123456858");
        self.HeroCode = ko.observable("2455654");

 }

ko.applyBindings(new ViewModel());

Answer 1

查看KO文档的this页面了解更多详情。您可能也对mapping插件感兴趣。

这是我使用的模式：

function ViewModel(data) {
  var self = this;

  self.HeroName = ko.observable(data.HeroName);
  self.ContactPhone = ko.observable(data.PhoneNumber);
  self.HeroCode = ko.observable(data.HeroCode);

}

var viewModel;
$.getJSON("/some/url", function(data) { 
    viewModel = new ViewModel(data);
})

ko.applyBindings(viewModel);

Answer 2

有几种方法可以做到这一点，但使用jQuery非常简单。

https://jsfiddle.net/2bwegmsv/4/

我将id添加到您想要数据的每个div中，然后将其添加到您的javascript中：

@+id\img_picture

可能无法正常工作，但应指向正确的方向。

Answer 3

动态地：只是绑定JSON对象。

var jsonDataViewModel = {HeroName:'Peter Parker', ContactPhone: '123456', HeroCode: 3}; 
ko.applyBindings(jsonDataViewModel);

http://knockoutjs.com/documentation/observables.html

如何使用JSON对象填充Knockout表单

3 个答案: