Question

我正在尝试将excel导入到ui-grid中。我正在尝试使用js xlsx libarary。我可以将xlsx转换为JSON，但我不确定如何将xlsx填充到ui-grid中。下面是ui-grid

$scope.samplesGridOptions = {
enableColumnResizing: true,
enableRowSelection: true,
multiSelect: false,
enableGridMenu: true,
enableCellEditOnFocus: true,
columnDefs: [
    { field: 'externalID', displayName: 'External ID' },
    { field: 'apexLotNum', displayName: 'APEX Lot' },
    {
        field: 'chamberName',
        displayName: 'Chamber Name',
        editType: 'dropdown',
        editableCellTemplate: 'ui-grid/dropdownEditor',
        enableCellEdit: true, editDropdownOptionsArray: $scope.chamberNameList,
        editDropdownIdLabel: 'value',
        editDropdownValueLabel: 'value'
    }
],
gridMenuCustomItems: [],
onRegisterApi: function (gridApi) {
    $scope.samplesGridAPI = gridApi;
    $scope.samplesGridOptions.data = $scope.virtualSampleList;
}
};

我正在尝试使用下面的js-xlsx库来解析加载的excel文件。但不确定如何将其推入ui-grid，javascripting和库

的新手

    $scope.ParseExcelDataAndSave = function () {
        var file = $scope.SelectedFileForUpload;
        if (file) {
            var reader = new FileReader();
            reader.onload = function (e) {
                var data = e.target.result;
                var workbook = XLSX.read(data, { type: 'binary' });
                var sheetName = workbook.SheetNames[0];
                var excelData = XLSX.utils.sheet_to_row_object_array(workbook.Sheets[sheetName]);
                var jsonData = JSON.stringify(excelData);
                if (jsonData.length > 0) {
                        **//Here I am not sure how can I populate the ui-grid from the JSON**
                }
                else {
                    $scope.Message = "No data found";
                }
            }
            reader.onerror = function (ex) {
                console.log(ex);
            }

            reader.readAsBinaryString(file);
        }
    }

Answer 1

这是js-xlsx文档中给出的示例：¹

$http({
    method:'GET',
    url:'https://sheetjs.com/pres.xlsx',
    responseType:'arraybuffer'
}).then(function(response) {
    var wb = XLSX.read(response.data, {type:"array"});
    var d = XLSX.utils.sheet_to_json(wb.Sheets[wb.SheetNames[0]]);
    $scope.data = d;
}, function(err) { console.log(err); });

对于文件，请使用：

function fileToArrayPromise(file) {
    var promise = $q(function(resolve, reject) {
        var reader = new FileReader();
        reader.onload = function (e) {
            var data = e.target.result;
            resolve(data);
        }
        reader.onerror = function (ex) {
            reject(ex);
        }
        reader.readAsArrayBuffer(file);
    })
    return promise;
}

fileToArrayPromise(file)
  .then(function(data) {
    var wb = XLSX.read(data, {type:"array"});
    var d = XLSX.utils.sheet_to_json(wb.Sheets[wb.SheetNames[0]]);
    $scope.data = d;
}, function(err) {
    console.log(err);
    throw err;
});

有关更多信息，请参见

SheetJS Demos - AngularJS

从Excel Angular JS导入

1 个答案: