Связывание данных Ajax с использованием Knockout Js

Я использую нокаут js, я нахожу diffcult для привязки данных в то время как в методе get ajax, я создал модель, функцию viewModel и ajax, у меня есть метод ajax в тот же файл js, где я создал viewModel, я вызываю ajax на загрузку страницы и пытаюсь связать свой html с konckout js, я получаю ошибку userModel is undefined, если я даю this.name = ko.observale(result[0].name) перед вызовом ajax, после того, как ajax вызвал его, давая name is undefined нужна помощьСвязывание данных Ajax с использованием Knockout Js

<html> 
    <head> 
    <script src="js/jquery1.9.js"></script> 
    <script src="js/knockout-3.3.0.js"></script> 
    <script src="js/knockout.mapping.js"></script> 
    <script src="model/usermodel.js"></script> 
    </head> 

    <body> 

    <div> 
     <h1><span data-bind="text:user().name"></span></h1> 
     <h1><span data-bind="text:user().userName"></span></h1> 
    </div> 
    <script src="ViewModel/userDetailsViewModel.js"></script> 
    </body> 
</html>

////Model//// 
function userModel(result) { 
    var self = this; 
    this.name = ko.observable(result[0].name); /// give me error undefined before the ajax call and after ajax call i get the value in result 
    this.userName = ko.observable(); 

} 

/////View Model//// 
var result 
var userDetailsViewModel = function(result) { 
    self = this; 
    self.user = ko.observable(new userModel(result)); 
}; 
var mainUserDetailsViewModel = new userDetailsViewModel(result); 
ko.applyBindings(mainUserDetailsViewModel); 

////ajax called on the page load //// 
$.ajax({ 
    type: "POST", 
    dataType: "json", 
    url: baseUrl + 'api/xx/xxx', 
    data: jason.strigfy(), 
    success: function(data) { 
    result = data; 
    ////I am getting in result json data object 0=["name":"nnnn","Username":"mmmmmm"], 
    //// i am passing this result to ViewModel and to Usermodel Constructor// 
    mainUserDetailsViewModel.user(new userModel(result)); 

    }, 
    error: function(error) { 
    jsonValue = jQuery.parseJSON(error.responseText); 
    //jError('An error has occurred while saving the new part source: ' + jsonValue, { TimeShown: 3000 }); 
    } 
});

источник

2016-08-03 kitty sarvaj

Вот мое предложение иметь чистую вложенную модель представления.
Пример: https://jsfiddle.net/kyr6w2x3/28/

function UserViewModel() { 
    var self = this; 
    self.UsersList = ko.observableArray([]); 

    self.GetUsers = function(){ 
     $.ajax({ 
     type: "POST", 
     dataType: "json", 
     url: baseUrl + 'api/xx/xxx', 
     data: jason.strigfy(), 
     success: function (data) { 
      //Here you map and create a new instance of userDetailVM 
      self.UsersList($.map(data, function (user) { 
       return new UserDetailViewModel(user); 
      })); 
     } 
     }); 
    } 
    //call to get users list when the VM is loading or you can call it on any event on your model 
    self.GetUsers(); 

} 

function UserDetailViewModel(data){ 
    var self = this; 
    self.Name= ko.observable(data.name); 
    self.UserName= ko.observable(data.username); 
} 


ko.applyBindings(new UserViewModel());

Вид:

<h1 data-bind="foreach:UsersList"> 
    <div data-bind="text:Name"></div> 
    <div data-bind="text:UserName"></div> 
</h1>

источник

2016-08-03 15:07:15

@thanks много для своего времени, его работал для меня .. –

Связывание данных Ajax с использованием Knockout Js

ответ

Смежные вопросы