нагрузки Нокаут не observableArray работает

Question

Попытка загрузить observableArray с JSON от сервера, как это:

function InsightViewModel() { 
    var self = this; 
    self.Name = ko.observable(""); 

    var insightData = { 
     Name: self.Name 
    }; 

    self.insightData = ko.observable(); 
    self.Insights = ko.observableArray([]); 

    $.ajax({ 
     type: "GET", 
     url: '@Url.Action("GetIndexData", "Admin")', 
     contentType: "application/json", 
     dataType: "json", 
     data:{}, 
     success: function (data) { 
      self.Insights(data); 
      alert(JSON.stringify(data) + "Array length " + self.Insights.length); 
     }, 
     error: function (error) { 
      alert(error.status + " " + error.statusText); 
     } 
    }); 
}; 

var viewModel = new InsightViewModel(); 
ko.applyBindings(viewModel); 
alert(viewModel.Insights.length); 

Я могу предупредить вне JSON от сервера, и это справедливо. Но массив пуст.

Я попробовал это, не повезло:

$(data).each(function (element) { 
    self.Insights.push(element); 
}); 

Не то, что опыт работы с нокаутом. Есть предположения?

Answer 1

Вы неправильно получить длину Insights observableArray, это должно быть так:

self.Insights().length // with brackets 

Другая проблема, как описано @ haim770 звонит alert после ko.applyBindings(viewModel). Существует большая вероятность, что запрос ajax еще не завершен.

Answer 2

Причина, по которой массив пуст, поскольку по умолчанию ajax является асинхронным. работа вокруг заключается в том, чтобы добавить async: false в ваш вызов ajax, но это не лучший практик. Вместо добавления асинхр: ложное использование .done ...

function InsightViewModel() { 
    var self = this; 
    self.Name = ko.observable(""); 

    var insightData = { 
     Name: self.Name 
    }; 

    self.insightData = ko.observable(); 
    self.Insights = ko.observableArray([]); 

    $.ajax({ 
     type: "GET", 
     url: '@Url.Action("GetIndexData", "Admin")', 
     contentType: "application/json", 
     dataType: "json"    
    }) 
    .done(function(data) 
    { 
     self.Insights(data); 
    }); 
}; 

var viewModel = new InsightViewModel(); 
ko.applyBindings(viewModel); 
alert(viewModel.Insights.length()); 

Надеются, что это работа ...