Question

var app = angular.module('myngCsv', [ngcsv]);
app.controller('ngcsvCtrl', function($scope,$csv) {

    $scope.csv ={
        content: null;
        header: true,
        headerVisible: true,
        separator: ',',
        separatorVisible: true,
        result: null,
        encoding: 'ISO-8859-1',
        encodingVisible: true,
        accept: ".csv"
    };

});

这是尝试过的。确实

Answer 1

您可以编写一个函数将CSV转换为JSON并将CSV对象传递给它。您需要做的就是将第一行CSV保存为标题（您可以用逗号标识它们），并且可以通过换行符\n识别新条目完成我下面写的功能。

function csvToJSON(csv, callback) {
            var lines = csv.split("\n");
            var result = [];
            var headers = lines[0].split(",");
            for (var i = 1; i < lines.length - 1; i++) {
                var obj = {};
                var currentline = lines[i].split(",");
                for (var j = 0; j < headers.length; j++) {
                    obj[headers[j]] = currentline[j];
                }
                result.push(obj);
            }
            if (callback && (typeof callback === 'function')) {
                return callback(result);
            }
            return result;
        }

Answer 2

您可以尝试使用Papaparse看起来非常简单和优雅地使用

Answer 3

创建fileReader指令：

<input type="file" data-file-reader-directive="fileContent" accept=".csv" />

从文件中获取csv数据的指令：

app.directive('fileReaderDirective', function() {
    return {
        restrict: "A",
        scope: {
            fileReaderDirective: "=",
        },
        link: function(scope, element) {
            $(element).on('change', function(changeEvent) {
                var files = changeEvent.target.files;
                if (files.length) {
                    var r = new FileReader();
                    r.onload = function(e) {
                        var contents = e.target.result;
                        scope.$apply(function() {
                            scope.fileReaderDirective = contents;
                        });
                    };
                    r.readAsText(files[0]);
                }
            });
        }
    };
});

创建工厂以将csv数据转换为json数据

app.factory('readFileData', function() {
    return {
        processData: function(csv_data) {
            var record = csv_data.split(/\r\n|\n/);
            var headers = record[0].split(',');
            var lines = [];
            var json = {};

            for (var i = 0; i < record.length; i++) {
                var data = record[i].split(',');
                if (data.length == headers.length) {
                    var tarr = [];
                    for (var j = 0; j < headers.length; j++) {
                        tarr.push(data[j]);
                    }
                    lines.push(tarr);
                }
            }

            for (var k = 0; k < lines.length; ++k){
              json[k] = lines[k];
            }
            return json;
        }
    };
});

查看工作示例：https://plnkr.co/edit/ml29G85knZpWWNdG8TeT?p=preview

如何将上传的csv转换为angularjs中的json对象

3 个答案: