ng-repeat nested loop

Question

I'm looping through an array and using a filter to separate my results grouped by day. It works, but now I can't seem to access the variables inside the second loop, where I have the filter.

<ion-list class="list list-inset"  ng-repeat="(key, value) in Jobs | groupBy: 'FilterTime'">
    <div class="item item-divider"><center>{{key}}</center></div>

    <div class="list list-inset" >
        <div class="item item-divider"><center>{{JobCount}} jobs</center></div>

        <a class="item item-icon-left item-icon-right" href="#/app/viewjob/{{job.BookingPublicId}}" ng-repeat="job in value  | groupBy: 'BookingTime'">
            <i class="icon ion-android-car "></i>
            <h2>{{job.EndAddress1stLine}}</h2>
            <p>{{job.StartAddressPostCode}} <b>></b> {{job.EndAddressPostCode}}</p>

            <p ng-show="job.Status == 0"><b>Waiting</b> - {{job.BookingTime * 1000 | date:'dd-MM-yyyy hh:mm'}}</p>
            <p ng-show="job.Status == 2"><b>Accepted</b> - {{job.BookingTime * 1000 | date:'dd-MM-yyyy hh:mm'}}</p>
            <p ng-show="job.Status == 4"><b>Enroute to job</b> - {{job.BookingTime * 1000 | date:'dd-MM-yyyy hh:mm'}}</p>
            <p ng-show="job.Status == 6"><b>Waiting for customer</b> - {{job.BookingTime * 1000 | date:'dd-MM-yyyy hh:mm'}}</p>
            <p ng-show="job.Status == 8"><b>Job Started</b> - {{job.BookingTime * 1000 | date:'dd-MM-yyyy hh:mm'}}</p>
            <p ng-show="job.Status == 10"><b>Complete</b> - {{job.BookingTime * 1000 | date:'dd-MM-yyyy hh:mm'}}</p>
            <!--<span class="item-note">{{job.StartAddressPostCode}} > {{job.EndAddressPostCode}}</span>-->
            <i class="icon ion-chevron-right "></i>
        </a>
    </div>
    <!--<p>{{value.BookingPublicId}} <b>></b> {{EndAddressPostCode}}</p>-->
</ion-list>

Now, anything in job.variable doesn't load but if I do just job it'll spit out all the json.

As you can see, the grouping works; but I can't see any data. If I spit out just job I get this:

EDIT: The data looks like:

[
{
"BookingPublicId": "C1LY482T",
"BookingTime": 1462238100,
"FilterTime": "03/05/2016",
"BookingName": "",
"Status": 1,
"PassengersName": "John Smith",
"PassengersMobile": null,
"Fare": "544.13",
"StartAddressPostCode": "RG2 0GH",
"StartAddress1stLine": "Drake Way",
"EndAddressPostCode": "M90 1QX",
"EndAddress1stLine": "Drake Way",
"Status1": 1,
"Resp": "OK"
},
{
"BookingPublicId": "ZGX39WNB",
"BookingTime": 1462268100,
"FilterTime": "03/05/2016",
"BookingName": "",
"Status": 1,
"PassengersName": "John Smith",
"PassengersMobile": null,
"Fare": "544.13",
"StartAddressPostCode": "RG2 0GH",
"StartAddress1stLine": "Drake Way",
"EndAddressPostCode": "M90 1QX",
"EndAddress1stLine": "Drake Way",
"Status1": 1,
"Resp": "OK"
}
]

Can you please post your JSON/array that you are looping?

thepio
– thepio

2016-05-03 09:25:35 +00:00
Commented May 3, 2016 at 9:25 — thepio
– thepio, Commented May 3, 2016 at 9:25
I've added it in below

MissCoder87
– MissCoder87

2016-05-03 09:31:50 +00:00
Commented May 3, 2016 at 9:31 — MissCoder87
– MissCoder87, Commented May 3, 2016 at 9:31
Thank you! Can you still add the filter function?

thepio
– thepio

2016-05-03 09:33:13 +00:00
Commented May 3, 2016 at 9:33 — thepio
– thepio, Commented May 3, 2016 at 9:33

Philipp Beck · Accepted Answer · 2016-05-04 10:21:23Z

2

From your second picture it seems job is an Array not an Object so job.EndAddress1stLine wouldn't work.

If your job just contains one Object you could use something like (job[0]).EndAddress1stLine. (This also means that there might be something wrong with your data structure. You should look at it again if you have the possibility to get just an Object)

If it contains multiple Objects you would need (as mentioned in the Comments) another ng-repeat over job.

edited May 4, 2016 at 10:21

answered May 3, 2016 at 9:30

Philipp Beck

4592 silver badges14 bronze badges

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

4 Comments

MissCoder87 Over a year ago

How would I display the information for each row then?

cst1992 Over a year ago

@Tom You should use ng-repeat for each array that you encounter.

cst1992 Over a year ago

@Tom keep in mind that if you use [0] then it'll only use the first object in your job array. To use the second one you'll need another ng-repeat, or a manual [0] and [1].

Philipp Beck Over a year ago

@Tom it would be interesting to know how the value Object looks like and if the job Array contains just one Object or multiple Objects

Collectives™ on Stack Overflow

ng-repeat nested loop

1 Answer 1

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related