Explore our sites

Stack Exchange
tour help
careers 2.0
Take the 2-minute tour ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.
up vote 0 down vote favorite

Hi I am new to angular and just trying to learn how to do a few things. I have got stuck in trying to display the following data. Using the Batarang plugin for chrome i can see my restful webservice returning the following json which is wrapped into my model.

    { 
    course:  { 
        country: Test1
        numberEnrolledPerMonthPerWeek:  { 
            entry: 
            [  { 
                key: 2
                value:  { 
                    numberEnrolled: 0
                    weeks: 2
                    year: 2011
                } 
            } ,  { 
                key: 3
                value:  { 
                    numberEnrolled: 4
                    weeks: 3
                    year: 2011
                } 
            } ,  { 
                key: 4
                value:  { 
                    numberEnrolled: 6
                    weeks: 4
                    year: 2011
                } 
            } ,  { 
                key: 8
                value:  { 
                    numberEnrolled: 0
                    weeks: 8
                    year: 2011
                } 
            }  
            ]
        } 
    } 
 }

I am trying to get the numberEnrolled value out for each key into a column. So in my html I have the following

<table class="table table-striped table-bordered">
            <tr ng-repeat="course in enrolledcourses.enrolledEnrolment">
                <td>                                
                    {{course.country}}
                </td>   
                <td>
                    {{course.numberEnrolledPerMonthPerWeek[2].numberEnrolled}}
                </td>               
            </tr>   
        </table>

{{course.numberEnrolledPerMonthPerWeek[2].numberEnrolled}} does not return me any value so can anyone advise what would be the correct syntax to get the numberEnrolled value please.

I have tried 

{{course.numberEnrolledPerMonthPerWeek.2.numberEnrolled}}
{{course.numberEnrolledPerMonthPerWeek[2][numberEnrolled]}}

My controller code is as follows

.controller('PeopleCtrl', function($scope, recruitmentFactory) {
    $scope.enrolledcourses = recruitmentFactory.get();


    $scope.test = "hello";
    $scope.save = function() {
        alert("save has been called");
    };
})
share|improve this question
 
if this is in a controller, please show it. is the model in the $scope? in any case, numberEnrolledPerMonthPerWeek is an object and the field 2 doesn't exist there –  Eduard Gamonal Oct 22 '13 at 14:28
 
i can see that it is an object but how do i get to the entries in that object –  user1107753 Oct 22 '13 at 14:33
add comment

4 Answers

up vote 0 down vote accepted

Firstly, your JSON has plenty of mistakes. maybe it's just the output you got, but just in case:: there are missing commas and Test is a symbol but I guess it's intenteded to be a string.

$scope.enrolledcourses = {
    course : {
    country: 'Test1',
    numberEnrolledPerMonthPerWeek: {
        entry: [{
            key: 2,
            value: {
                numberEnrolled: 0,
                weeks: 2,
                year: 2011,
            }
        }, {
            key: 3,
            value: {
                numberEnrolled: 4,
                weeks: 3,
                year: 2011
            }
        }, {
            key: 4,
            value: {
                numberEnrolled: 6,
                weeks: 4,
                year: 2011
            }
        }, {
            key: 8,
            value: {
                numberEnrolled: 0,
                weeks: 8,
                year: 2011
            }
        }]
    }
    }
};

then your html needs to access the correct properties:

    <tr ng-repeat="course in enrolledcourses">
        <td>{{course.country}}</td>
        <td>{{course.numberEnrolledPerMonthPerWeek.entry[2].value.numberEnrolled}}</td>
    </tr>

this is a live example

share|improve this answer
 
i posted my answer below which is the same as yours –  user1107753 Oct 23 '13 at 7:00
 
yeah I think I was writing mine when you posted an answer –  Eduard Gamonal Oct 23 '13 at 7:21
add comment
up vote 1 down vote

Just to provide some extra help: I run into this problem a lot with figuring out how to navigate through JSON data. Try using visualization tools, and validate your JSON to make sure its correct.

Here is what I use to visualize the data: http://jsonviewer.stack.hu/ Validation here: http://jsonlint.com/

share|improve this answer
add comment
up vote 0 down vote 
numberEnrolledPerMonthPerWeek[2] is not your array

try 

numberEnrolledPerMonthPerWeek.entry[2]
share|improve this answer
 
trying the above produces {"key":"4","value":{"numberEnrolled":"6","weeks":"4","year":"2011"}} –  user1107753 Oct 22 '13 at 14:36
 
Thanks for this it helped a lot in guiding me to the answer which I have posted above –  user1107753 Oct 22 '13 at 14:39
 
I am always glad if I can help :) –  minime Oct 22 '13 at 17:19
add comment
up vote 0 down vote

Okay so i did the following to get the value out

{{course.numberEnrolledPerMonthPerWeek.entry[2].value.numberEnrolled}}
share|improve this answer
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.