ng-repeat nested array of object in same row

Question

I am trying to bind the data in the same row in a nested array.

My Array of Objects

$scope.Record = [
{ Name:'Adam', 

Months:[
 {Month: 'Jan', Value: 10, cust:2},
 {Month: 'Feb', Value: 30, cust:2}
 {Month: 'March', Value: 30, cust:2}
 {Month: 'April', Value: 50 , cust:2}
 {Month: 'June', Value: 15 , cust:2}
 ] },

  { Name:'John', 
Months:[
 {Month: 'Jan', Value: 10 , cust:3},
 {Month: 'Feb', Value: 30,, cust:6}
 {Month: 'March', Value: 30,, cust:8}
 {Month: 'April', Value: 50,, cust:13}
 {Month: 'June', Value: 15,, cust:20}
 ] }
]

my View

     <tr>
         <th colspan="1">Customer</th>
         <th colspan="2">January</th>
         <th colspan="2">February</th>
         <th colspan="2">March</th>
          <th colspan="2">April</th>
          <th colspan="2">May</th>
          <th colspan="2">June</th>
    </tr>
     <tr>
       <th>Name</th>
       <th>Value</th>
       <th>Cust</th>
     </tr>
    <tbody>
    <tr ng-repeat="rc in Record">
      <td ng-bind="rc.Name"></td>
      <td ng-bind="rc.Months[0].Value"></td>
      <td ng-bind="rc.Months[0].cust"></td>
     </tr>
    </tbody>

How to bind all the Months array of Object in the same row. I am trying all the things but not getting any luck.

Thank you

Gerald LeRoy · Accepted Answer · 2022-02-02 19:21:25Z

1

I updated your code and provided a working example here: https://jsfiddle.net/galeroy/z97u230v/25/

Here's the trick to implementing nested repeats in AngularJS

<tbody ng-repeat="rc in records">
    <tr>
        <td>{{rc.name}}</td>
        <td colspan="2" ng-repeat="item in rc.months">
            <span ng-if="item.value">val: </span> {{item.value}}
            <span ng-if="item.value && item.cust">, </span>
            <span ng-if="item.cust">cust:</span> {{item.cust}}        
         </td>
      </tr>
 </tbody>

edited Feb 2, 2022 at 19:21

answered Feb 2, 2022 at 16:40

Gerald LeRoy

1,2872 gold badges11 silver badges18 bronze badges

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

Collectives™ on Stack Overflow

ng-repeat nested array of object in same row

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related