CSV Parser через angularJS

Question

Я создаю синтаксический анализатор CSV через узел и угловой. поэтому в основном пользователь загружает файл csv, на моей стороне сервера, который является узлом, файл csv проходит и анализируется с использованием node-csv . Это работает отлично, и он возвращает мне массив объектов, основанный на файле csv, заданном как входной, Теперь на угловом конце мне нужно отобразить две таблицы, это сама запись данных csv, а другая - cross tabulation. Я перед проблемой при визуализации данных, поэтому для таблицы как

я получаю разбор товар, как

Для перекрестного табулирования нам нужны данные в табличной форме, как

У меня есть массив объектов, который Мне нужно манипулировать наилучшим образом, чтобы сделать рендеринг на html-странице. Я не получаю способ, как делать расчет по данным, которые я получаю, чтобы сохранить результат перекрестной табуляции. Любая идея о том, как мне подойти.

JSON данные:

[{"Sample #":"1","Gender":"Female","Handedness;":"Right-handed;"},{"Sample #":"2","Gender":"Male","Handedness;":"Left-handed;"},{"Sample #":"3","Gender":"Female","Handedness;":"Right-handed;"},{"Sample #":"4","Gender":"Male","Handedness;":"Right-handed;"},{"Sample #":"5","Gender":"Male","Handedness;":"Left-handed;"},{"Sample #":"6","Gender":"Male","Handedness;":"Right-handed;"},{"Sample #":"7","Gender":"Female","Handedness;":"Right-handed;"},{"Sample #":"8","Gender":"Female","Handedness;":"Left-handed;"},{"Sample #":"9","Gender":"Male","Handedness;":"Right-handed;"},{"Sample #":";"} 

Answer 1

Существует много способов сделать это, и, поскольку вы не очень конкретно относитесь к использованию, я поеду с простейшим.

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

[ 
{gender: 'female', handdness: 'lefthanded', id: 1}, 
{gender: 'male', handdness: 'lefthanded', id: 2}, 
{gender: 'female', handdness: 'righthanded', id: 3}, 
{gender: 'female', handdness: 'lefthanded', id: 4}, 
{gender: 'female', handdness: 'righthanded', id: 5} 
] 

и в контроллере вы выставили это что-то вроде:

$scope.members = [the above array of objects]; 

и вы хотите, чтобы отобразить общее количество женщин-членов этого объекта, вы можете отфильтровать это в своем html

{{(members | filter:{gender:'female'}).length}} 

Теперь, если вы сделав эту таблицу, она, очевидно, сделает некоторые уродливые и нечитаемые html, поэтому, особенно если вы собираетесь повторять это, это было бы хорошим примером для создания директивы и повторения в любом месте, с предпосылкой предоставления объекта области названный tabData (или что вы хотите) в вашей родительской области

.directive('tabbed', function() { 
    return { 
    restrict: 'E', 
    template: '<table><tr><td>{{(tabData | filter:{gender:"female"}).length}}</td></tr><td>{{(tabData | filter:{handedness:"lefthanded"}).length}}</td></table>' 
    } 
}); 

вы могли бы использовать это в HTML так:

<tabbed></tabbed> 

И есть конечно много способов улучшить это, как вы хотите.

Answer 2

Это больше общей структуры данных/JS вопрос, чем радиально связаны между собой.

Functional helpers from Lo-dash очень кстати здесь:

_(data) // Create a chainable object from the data to execute functions with 
.groupBy('Gender') // Group the data by its `Gender` attribute 
// map these groups, using `mapValues` so the named `Gender` keys persist 
.mapValues(function(gender) { 
    // Create named count objects for all handednesses 
    var counts = _.countBy(gender, 'Handedness'); 
    // Calculate the total of all handednesses by summing 
    // all the values of this named object 
    counts.Total = _(counts) 
    .values() 
    .reduce(function(sum, num) { return sum + num }); 
    // Return this named count object -- this is what each gender will map to 
    return counts; 
}).value(); // get the value of the chain 

Нет необходимости беспокоиться о для петель или что-нибудь в этом роде, и этот код также работает без каких-либо изменений в течение более чем двух полов (даже для более две ручности - подумайте об инопланетянах и об удалении друг друга). Если вы точно не знаете, что происходит, достаточно просто выделить отдельные шаги и их значения результата этого примера кода.

Расчет общей строки для всех полов будет работать аналогичным образом.