AngularJS: Display array of objects in rows

Question

I have a returned array of objects in AngularJS and i want to display it in two rows. I have something like this:

{"name":something ,"value0":12455.847233333334, "value1": 9.887...}

I have tried something like this:

                      <div class="row">
                       <div class="col-md-6" ng-repeat = "item in items track by $index" ng-if="$index < 10">
                      {{item}}


                       </div>
                       <div class="col-md-6" ng-repeat = "item in items track by $index" ng-if="$index >= 10">
                      {{item}}
                       </div>   

                    </div>

But it does not have the intended outcome. I want it to be displayed like

name: something

value0: 12455.847233333334

value1: 9.887

...

Anita · Accepted Answer · 2016-06-03 07:02:07Z

1

You need to iterate on object keys. Like this :

<div class="col-md-6" ng-repeat = "(key, value) in data" ng-if="$index >= 10">
        {{key}}:{{value}}
 </div>

edited Jun 3, 2016 at 7:02

answered Jun 3, 2016 at 6:33

Anita

2,4102 gold badges21 silver badges30 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

blaa Over a year ago

it still gets displayed the whole array. Something like this 0: {"name":something ,"value0":12455.847233333334, "value1": 9.887...}

Anita Over a year ago

Then you are not getting object in data, you are getting an array. So you need to take care for that. If you want to display first row data of array then -> (key, value) in data[0] in ng-repeat

Anita Over a year ago

Welcome, If it worked then you can accept the answer :P

Aravinthan K · Accepted Answer · 2016-06-03 06:35:23Z

0

you can bind the values like these

<div class="row">
    <div class="col-md-6" ng-repeat = "item in items track by $index" ng-if="$index < 10">
       name: {{item.name}}

       value0: {{item.value0}}

       value1: {{item.value1}}

 </div>

answered Jun 3, 2016 at 6:35

Aravinthan K

1,9012 gold badges20 silver badges24 bronze badges

Collectives™ on Stack Overflow

AngularJS: Display array of objects in rows

2 Answers 2

3 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related