Шаблон для одномерного массива с Knockout.js и ko.mapping - PullRequest
Новая
       7

Шаблон для одномерного массива с Knockout.js и ko.mapping

0 голосов
/ 30 сентября 2011

У меня есть строка JSON, которую я сопоставляю с плагином ko.mapping, и мне нужно создать наблюдаемые привязки для одного из сопоставленных массивов.Массив находится в JSON как [1,2,3,4,5], поэтому у него нет индекса.

У меня есть следующий код, работающий до определенной точки: 

<script id="statRowTemplate" type="text/html">
    {{if type() != "column"}}
    <tr>
            <td><label>Name: </label><input data-bind="value: name" /></td>
            <td><label>Plot Points: </label><ul data-bind="template: {name: 'dataTemplate' , foreach: data}"></ul> </td>
    </tr>
    {{/if}}
</script>
<script type="text/html" id="dataTemplate">         
<li>
    <p>${this.data}</p>
        <input data-bind="value: this.data" />
</li>
</script>
<button data-bind="click: saveChanges">Save Changes</button>

Таким образом, все работает, как ожидалось, за исключением <input data-bind="value: this.data" /> Это поле остается пустым ... ${this.data} Однако показывает правильное значение.

В целом, я пытаюсь обновить строку JSON и повторно сохранить ее в квартирефайл.Я могу привязать массив данных: [1,2,3,4] непосредственно к входному значению, но тогда он не будет обновлен как массив.

Вот viewModel: var viewModel = {}; 

$.getJSON('/data-forecast-accuracy.json', function(result) {

    viewModel.stats = ko.mapping.fromJS(result);
    console.log(result)
    viewModel.saveChanges = function() {

        var unmapped = ko.mapping.toJSON(viewModel.stats);
        console.log(unmapped);

        $.post('save-changes.php', {data: unmapped})
        .success(function() { console.log("second success"); })
        .error(function() {  console.log("error"); })
        .complete(function() {  console.log("complete"); });
    }

    ko.applyBindings(viewModel);
});

Вот JSON:

[ { "type":"spline", "marker":{ "symbol":"diamond" }, "name":"Cumulative", "data":[10,17,18,18,16,17,18,19] }, { "type":"spline", "marker":{ "symbol":"circle" }, "name":"Monthly", "data":[10,22,20,19,8,20,25,23] } ]

Любая помощь будетс благодарностьюТакже открыты для предложений, если я подхожу к этому под неправильным углом.В конечном счете, просто нужно иметь возможность изменять строчку JSON через пользовательский интерфейс и затем сохранять ее.

Заранее спасибо.

1 Ответ

1 голос
/ 30 сентября 2011

Чтобы правильно отредактировать значение в массиве, вам нужно сопоставить исходный массив со структурой, которая содержит фактическое свойство для привязки к [1,2,3] становится [{val: 1}, {val: 2}, {val: 3}].Привязка к $data не будет работать, так как KO не может определить, как обновить его из пользовательского ввода (в настоящее время не может понять, что оно находится в некотором индексе в массиве).

Мне нравитсясделать что-то вроде: http://jsfiddle.net/rniemeyer/vv2Wx/

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

...