js-xlsx в нокауте - передать данные листа обратно на страницу/модель просмотра

Используя пакет js-xlsx, я читаю файл excel (успешно) со страницы, но я застрял, пытаясь передать эти данные обратно по цепочке, чтобы страница могла их использовать.

У меня есть функция, написанная в модели представления, которая срабатывает при изменении ввода:

<input name="xlfile" id="xlf"  class="left" data-bind="event: { change: function () { handleXLSfile($element) } }" style="width: 200px;" type="file">

Это запускает быструю предварительную проверку файла, а затем вызывает функцию XLSX следующим образом:

        self.XLSdata = [];
        self.EnrollstoValidate = [];


        self.handleXLSfile = function (element) {
            self.validManifest(false);
            //var rABS = true;
            var rABS = typeof FileReader !== "undefined" && (FileReader.prototype || {}).readAsBinaryString;

            var files = element.files;
            var f = files[0];
            var fileNamePieces = f.name.split('.');
            if (fileNamePieces.length <= 0) {
                self.validManifest(false);
            }
            else {
                var extension = fileNamePieces[fileNamePieces.length - 1];
                if (extension == "xls" || extension == "xlsx") {

                    self.validManifest(true);

                    do_xlsfile(f);

                }
            }
        };

У меня есть соответствующие функции XLSX в их собственном файле js, так как у меня есть три страницы, которые будут извлекать похожие файлы, и имеет больше смысла иметь одну функцию, которая вызывает все три, и передает данные обратно:

var global_wb;

X = XLSX;

var process_wb = (function () {
    var strOUT = "";

    var to_json = function to_json(workbook) {
        var result = {};
        workbook.SheetNames.forEach(function (sheetName) {
            var roa = X.utils.sheet_to_json(workbook.Sheets[sheetName], { header: 1 });
            if (roa.length) result[sheetName] = roa;
        });
        return result;
    };

    return function process_wb(wb) {
        global_wb = wb;
        var output = "";
        output = to_json(wb);
        strOUT = output;
        if (typeof console !== 'undefined') console.log("output", new Date());
        return output;
    };
})();

var do_xlsfile = (function (f) {
    var rABS = typeof FileReader !== "undefined" && (FileReader.prototype || {}).readAsBinaryString;

    return function do_file(f) {
        var XLSoutput = "";
        var rABS = false;
        var reader = new FileReader();
        reader.onload = function (e) {
            if (typeof console !== 'undefined') console.log("onload", new Date());
            var data = e.target.result;
            data = new Uint8Array(data);
            XLSoutput = process_wb(X.read(data, { type: rABS ? 'binary' : 'array' }));
            //self.XLSdata = XLSoutput;
        };
        reader.readAsArrayBuffer(f);
    };
})();

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

Я пытаюсь выяснить, как/где я могу передать объект XLSoutput обратно в область Knockout, чтобы я мог манипулировать им, отображать его на экране и т. д.

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

Конечно, в пакете js-xlsx есть образцы практически для любого другого языка, кроме Knockout.


javascript knockout.js js-xlsx
person VBartilucci    schedule 26.03.2018    source источник

Ответы (1)


arrow_upward
0
arrow_downward

У меня есть исправление, но оно кажется неуклюжим, и я не уверен, что нет лучшего решения.

Я добавил глобальную переменную, доступ к которой можно получить позже

self.handleXLSfile = function (element) {
            self.validManifest(false);
            global_BulkPage = "one2M";

И в файле reader.onload выше я добавил функцию, которая получает значение и отправляет данные в нужную модель просмотра.

  var Send2KO = function (XLSoutput) {
        switch (global_BulkPage) {
            case "one2M":
                ad.views.bulk_one2m.viewModel.XLSdata = XLSoutput;
                break;
            case "m2M":
                ad.views.bulk_m2m.viewModel.XLSdata = XLSoutput;
                break;
            case "delete":
                ad.views.bulk_delete.viewModel.XLSdata = XLSoutput;
                break;
            default:
            //no action
        }
    }

Так что у меня есть доступ к данным еще на уровне Knockout — теперь мне просто нужно найти правильный способ получить к ним доступ оттуда. Но это другой вопрос.

person VBartilucci    schedule 02.04.2018