Обслуживание не отражает обновление данных

StackOverflow https://stackoverflow.com/questions/4432731

  •  09-10-2019
  •  | 
  •  

Вопрос

Я создаю приложение, используя очень Slick Noundoutjs, но я столкнулся с зацеплением. На странице HTML у меня простая <select> Контроль, который я хочу загрузить с помощью данных JSON, возвращенные из веб-сервиса.

Я определяю наблюдаемый массив следующим образом:

var laborRow = function () {
    this.positions = ko.observableArray([]);
};

Когда нагрузка страницы, вызов AJAX выполнен, и данные возвращаются. В обратном вызове я делаю следующее:

    success: function (msg) {
        laborRow.positions = msg;
    }

Основываясь на документах Ko, я ожидаю, что я бы установил результат, как это:

laborRow.positions(msg);

Тем не менее, это просто бросает ошибку, заявив, что «трудоустройство» в не функциях »

Шаблон в HTML выглядит следующим образом:

<tbody data-bind='template: {name: "laborRowTemplate", foreach: laborLine}'> </tbody> 
</div>
  <script type="text/html" id="laborRowTemplate"> 
        <tr>

          <td><select data-bind='options: positions, optionsText: "Title", optionsCaption: "select", value: selectedPosition '></select></td>

        </tr>
    </script>

То laborRow Объект - это свойство на ViewModel, которая связана со страницей. По какой-то причине это не работает. Чтобы добавить другую морщину, если я добавлю код, чтобы заглянуть в наблюдательную плату и распечатать некоторые данные, данные там. Так что он успешно загружен.

Любые мысли были бы очень оценены.

Полный код для моего примера случая:

var laborRow = function () {
    this.positions = ko.observableArray([]);    
};

var projectEstimate = function () {
    this.laborLine = ko.observableArray([new laborRow()]);

};

var projectViewModel = new projectEstimate();
ko.applyBindings(projectViewModel);

//and the code in the callback function on ajax success

 success: function (msg) {
                laborRow.positions = msg;
                //laborRow.positions(msg); **this does not work - error is laborRow.positions is not a function**
            },

И HTML:

 <tbody data-bind='template: {name: "laborRowTemplate", foreach:
laborLine}'> </tbody>

  <script type="text/html" id="laborRowTemplate">
        <tr>
          <td><select data-bind='options: positions, optionsText:
"Title",  optionsCaption: "select", value: selectedPosition '></
select></td>

        </tr>
    </script> 

Наконец, благодаря комментариям SEAN ниже, я смог получить его работать, изменяя код в обратном вызове следующим образом:

success: function (msg) {
    projectViewModel.laborLine()[(projectViewModel.laborLine().length-1)].positionList(msg);
}
Это было полезно?

Решение

Проблема в том, что вы на самом деле не создали вашу модель:

var laborRow = function () {
    this.positions = ko.observableArray([]);
    // will only be called if you call var some_var = new laborRow()
};

Измените свою функцию в голый объект (как показано в Нокаут Документы):

var laborRow = {
    positions: ko.observableArray([])
};

И вы сможете позвонить laborRow.positions(msg); И у него работают.


РЕДАКТИРОВАТЬ

На основе нового кода, laborRow все еще не создается - если вы установлены var laborRow Где-то еще в вашем коде (по запросу Ajax, возможно), возможно, вы захотите убедиться, что ваш стек вызовов выглядит так:

projectViewModel.laborLine()[0].positions() 
// This will return the array you're looking for.
// The key is that laborLine is a `getter` not an attribute

Я был укушен «переменными KO getters нет attributes«Ошибка в несколько случаев ... может произойти с вашим кодом?

Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top