добавление нескольких элементов в сетку Slick с нокаутом observableArray

Я использую нокаутирующий пользовательский bindingHandler для привязки данных к slickgrid на основе примера rniemeyer, когда код запускается, если вы нажимаете ссылку «добавить», тогда строка добавляется в сетку с помощью myObservableArray.push(newRow), однако, когда вы попробуйте заменить все данные в сетке по ссылке "заменить" сетка не обновится и кнопка добавить перестанет работать. Я пытаюсь обновить наблюдаемый массив, вызвав myObservableArray(multipleRows), это правильный способ сделать это?

Пример: http://jsfiddle.net/davidoleary/bwSmy/

var viewModel = {
    items: ko.observableArray([]),
    addItem: function() {
        this.items.push(new Item(0, "New", 5.00));  // works
    },
    replace: function() {
        var newList = [new Item(0, "New", 6.00),new Item(0, "New", 7.00)]
        this.items(newList); // fails without throwing error
    }, 
}

slickgrid knockout.js ko.observablearray knockout-2.0
person Dave    schedule 05.06.2013    source источник

Ответы (3)


arrow_upward
1
arrow_downward

Вы пропустили SetData в обновлении кастомной привязки нокаута. grid.setData (данные, правда);

вот как это будет выглядеть:

ko.bindingHandlers.slickGrid = {
    init: function(element, valueAccessor) {
        var settings = valueAccessor();
        var data = ko.utils.unwrapObservable(settings.data);
        var columns = ko.utils.unwrapObservable(settings.columns);
        var options = ko.utils.unwrapObservable(settings.options) || {};
        grid = new Slick.Grid(element, data, columns, options);
    },
    update: function(element, valueAccessor, allBindingAccessor, viewModel) {
        var settings = valueAccessor();
        var data = ko.utils.unwrapObservable(settings.data); //just for subscription
        grid.resizeCanvas(); // NB Very important for when a scrollbar appears        
        grid.setData(data,true); // This is what was missing
        grid.render();
    }
}

обновленная скрипта: http://jsfiddle.net/joybroto/bwSmy/4/

person Joybroto    schedule 06.06.2013

arrow_upward
0
arrow_downward

Я не использую Knockout, но думаю, что это должно выглядеть так:

var newList = [new Item(0, "New", 6.00),new Item(0, "New", 7.00)];
this.items(ko.observableArray(newList));
person idbehold    schedule 06.06.2013

arrow_upward
0
arrow_downward

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

this.items(newList);

вы заставляете Knockout использовать другой массив. Хороший вариант — попросить SlickGrid сделать то же самое:

grid.setData(newList, true);
grid.render();

вот http://jsfiddle.net/bwSmy/6/, чтобы увидеть другие варианты

person Rustam    schedule 06.06.2013