Наблюдаемый массив Knockout.js не обновляется с сервера при использовании подключаемого модуля сопоставления

У меня небольшая проблема с Knockout.js и его плагином сопоставления. По сути, я хочу начать без данных, а затем при загрузке страницы сделать запрос Ajax для загрузки информации. Я знаю, что запрос Ajax работает по назначению, потому что я записываю в консоль данные по мере их возврата.

    var projectId = @Model.Project.Id;
    var stories;
    viewModel = ko.mapping.fromJS(stories);       

    $.ajax({
        type: "GET",
        url: "/Projects/JsonDetails",
        data: {id: projectId},
        success: function (data) {
            stories = data.stories;
            ko.mapping.fromJS(stories, viewModel);
            console.log(stories);
        }
    });

Консоль правильно регистрирует данные. поэтому я знаю, что запрос Ajax работает правильно.

Консоль правильно регистрирует данные. Поэтому я знаю, что запрос Ajax работает правильно.l

Посмотреть разметку:

   <section id="project-stories"  data-bind="foreach: stories">

            <div class="project-story-container drop-shadow">

                <div class="story-summary">
                    Story Summary
                </div>
                <div class="story" data-bind="attr:{'data-id': Id}">
                    As a <span  class="actor" data-bind="text: Actor"> </span> I want to <span  class="objective" data-bind="text: Objective"> </span>, so that  <span  class="justification" data-bind="text: Justification"></span>.
                </div>
                <div class="story-controls">
                    <a href="#">Edit</a>
                </div>
            </div>
        </section>

Я даже пытался позвонить:

   var projectId = @Model.Project.Id;
    var stories;
    viewModel = ko.mapping.fromJS(stories);
     ko.applyBindings(viewModel);

    $.ajax({
        type: "GET",
        url: "/Projects/JsonDetails",
        data: {id: projectId},
        success: function (data) {
            stories = data.stories;
            ko.mapping.fromJS(stories, viewModel);
            console.log(stories);
        }
    });

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

Может ли кто-нибудь увидеть, что я делаю неправильно? В конце концов, я хочу, чтобы в модели представления было подключено больше событий, что, я знаю, будет еще одной проблемой. Но сейчас я даже не могу заставить привязки правильно обновляться, когда запрос Ajax завершается.

Прекращение обучения здесь: http://knockoutjs.com/documentation/plugins-mapping.html< /а>

-------------------- ОБНОВИТЬ --------------------------

Я смог ответить на свой вопрос, сославшись на этот пост StackExhange:

Неразбериха с подключаемым модулем сопоставления Knockout JS

var projectId = @Model.Project.Id;
    var viewModel ={};
    $.ajax({
        type: "GET",
        url: "/Projects/JsonDetails",
        data: {id: projectId},
        success: function (data) {
            viewModel.stories = ko.mapping.fromJS(data.stories);
            ko.applyBindings(viewModel);
        }
    });

Проблема заключалась в том, что мне нужно было иметь пустую модель представления, чтобы это работало.


person sheldonj    schedule 13.03.2012    source источник


Ответы (2)


Проблема в том, как вы делаете отображение. Вы должны сопоставлять не data.stories, а data ko.mapping.fromJS(data, viewModel); Таким образом, подключаемый модуль сопоставления создаст наблюдаемый массив для историй, который затем можно будет использовать в своем шаблоне.

Если data содержит другие элементы, которые вы не хотите отображать, вы можете добавить их в массив игнорирования, чтобы отображались только истории.

Еще одна вещь: если вы начинаете без данных, вы получите эту ошибку при загрузке страницы, потому что Knockout попытается отобразить stories в вашей модели представления, когда такого свойства не существует. Заранее определите свою модель представления, чтобы она содержала stories в качестве наблюдаемого массива.

person Marek Karbarz    schedule 13.03.2012
comment
Может быть, я запутался. Я думал, что смысл использования плагина для отображения был в том, что мне не нужно было определять все мои наблюдаемые. Насколько я понял, вызов ko.mapping.fromJS(data); создал бы их для меня. Что, если у меня есть большой объект с большим количеством наблюдаемых? - person sheldonj; 14.03.2012
comment
Это правильно - он создаст наблюдаемые из объекта. Однако, если вы попытаетесь использовать свою модель представления до того, как будут определены все наблюдаемые (например, загрузка страницы), вы получите сообщение об ошибке (например, ваши истории не определены). - person Marek Karbarz; 14.03.2012
comment
Я не заметил, что вы не применяете привязку при загрузке страницы, поэтому, очевидно, в этом случае вы не получите ошибку. - person Marek Karbarz; 14.03.2012

@Marek Karbarz Привет, я не считаю, что вам следует передавать всю viewModel. Например, если у вас есть модель страницы, в модели есть объект SearchCriteria и объект Results. Почему вы хотите передать объект результатов обратно, когда вам нужно только выполнить поиск?

-Эдвард

person jonypony3    schedule 10.10.2012