Post data from JSON list into multiple tables on front end

Question

I have a JSON that I would like to put in the front end of my web application to be split into multiple tables (4 in precise).

Right now I have all my data from the JSON list is displayed in one table.

I am using AngularJS. Is there a way to split data into multiple tables without making changes to the database in the SQL Server (splitting by 4).

There's not much details to work with here. Is there a criteria you want to split the data by? You can just split the data on the front end by that criteria and give that data to 4 different tables. — Alen Genzić, Jul 12 '18 at 12:16
I don't have a criteria I just want to dynamically split data into four different tables. — Madhav, Jul 12 '18 at 12:23
What does "dynamically" mean in your context? Split it into 4 equal parts? Split it into 4 random tables? — Alen Genzić, Jul 12 '18 at 12:24

score 0 · Answer 1 · answered Jul 12 '18 at 13:59

Here is an example:

angular.module('myApp', []).controller('personCtrl', function($scope) {
    $scope.test = [
        {name:'audi1',price:'200'},
        {name:'audi2',price:'200'},
        {name:'audi3',price:'200'},
        {name:'audi4',price:'200'},
        {name:'audi5',price:'200'},
        {name:'audi6',price:'200'},
        {name:'audi7',price:'200'}
    ];
});

<div class="row">
        <div class="col-md-6" ng-repeat="group in [0,1] ">
            <p>{{group}}</p>            
            <p ng-repeat="t in test" ng-if="group == test.indexOf(t) >= test.length/2" > 
              {{t}}              
            </p>
            <br>
        </div>
    </div>

Which will output:

0

{"name":"audi1","price":"200"}

{"name":"audi2","price":"200"}

{"name":"audi3","price":"200"}

{"name":"audi4","price":"200"}


1

{"name":"audi5","price":"200"}

{"name":"audi6","price":"200"}

{"name":"audi7","price":"200"}

This worked perfectly. Thank you – Madhav Jul 12 '18 at 15:34 — Madhav, Jul 12 '18 at 15:34

Post data from JSON list into multiple tables on front end

1 Answers1