CODEWITHSUNDEEP
javascriptjsonember.jsember-data
Ranjeet SIngh
Ranjeet SIngh

Reputation: 673

Unable to loop through json response in ember template

My json array is 

{
    "object": {
        "assignments": [
            {
                "assignmentId": 14706368,
                "sectionId": 0,
                "assignmentTitle": "file attachment A",
                "assignmentStartDate": "01/01/1900",
                "assignmentStartTime": "01:00AM",
                "assignmentDueDate": "01/01/2100",
                "assignmentDueTime": "01:00AM",
                "isMarathonChain": "No",
                "assignmentTimeLimit": 0,
                "assignmentTimeRemaining": "0",
                "marathonAssignmentStatus": "MARATHON_NOT_ASSOCIATED",
                "showAssignmentAttemptsAndPasswordDetails": false,
                "assignmentAttemptsTaken": 0,
                "assignmentAttemptsAllowed": "1",
                "showPasswordForm": false,
                "isStartAssignment": true,
                "isResumeAssignment": false,
                "isSubmitAssignment": false,
                "passwordRequired": false,
                "isConvertToGeniusEnabled": false,
                "draftNumber": 0,
                "studentExceptionExistsForDueDate": false,
                "isPastUploadDate": false,
                "showMarathonPrerequisiteInfo": false
            }
        ],
        "sections": [
            {
                "sectionId": 241409387,
                "courseId": 241409386,
                "sectionName": "Section01"
            }
        ],
        "courses": [
            {
                "courseId": 241409386,
                "courseName": "Tricon.Connect_01",
                "showDiscipline": false
            }
        ],
        "users": [
            {
                "userId": 1000321061,
                "firstName": "Ragu �������&^&",
                "lastName": "+#@)()Tricon �^^������",
                "userType": "S"
            }
        ],
        "returnLMS": [
            {
                "returnUrl": "bb"
            }
        ]
    }
}

and i want to loop through suppose assignmet values i am writing this in my template for looping model

{{#each obj in model.object}}
                <tr>
                {{#each assign in obj.assignments }}
                  <td>
                    {{assign.assignmentId} <br />{{assign.assignmentTitle}
                  </td>
                  {{/each}}
                </tr>
              {{/each}}

But i am not getting the output. My loop is getting failed at 1st line only. i have to use these values to match some condition and display info.

Upvotes: 2

Views: 342

Answers (2)

real_ate
real_ate

Reputation: 11289

This is now handled by using the {{each-in}} helper in the template. You can read more about it here but I will attempt an example that will work in your case

{{#each-in model.object as |key values|}}
  <tr>
    {{#each values as |assign|}}
      <td>
        {{assign.assignmentId} <br /> {{assign.assignmentTitle}
      </td>
    {{/each}}
  </tr>
{{/each}}

Although your example looks more like you want to only loop through assignments because you are using assignment specific code inside the inner each so that would just look like this

{{#each model.object.assignments as |values|}}
  <tr>
    {{#each values as |assign|}}
      <td>
        {{assign.assignmentId} <br /> {{assign.assignmentTitle}
      </td>
    {{/each}}
  </tr>
{{/each}}

If you did, however, want to loop through each of the keys and have different templates based on which key you are currently dealing with you could do something like this: 

{{#each-in model.object as |key values|}}
  {{#if (eq key 'assignments')}}
    <tr>
      {{#each values as |assign|}}
        <td>
          {{assign.assignmentId} <br /> {{assign.assignmentTitle}
        </td>
      {{/each}}
    </tr>
  {{/if}}
  {{#if (eq key 'sections')}}
    <tr>
      {{#each values as |section|}}
        <td>
          {{section.sectionId} <br /> {{section.sectionName}
        </td>
      {{/each}}
    </tr>
  {{/if}}
{{/each}}

But of course that would be up to you and what you're trying to achieve with your application 😂 Also, by the way, this example makes use of ember-truth-helpers which is quite useful if you want to do things like those {{#if}} blocks in my example.

Upvotes: 3

GJK
GJK

Reputation: 37369

Based on the example JSON you've given, the following line is your problem:

{{#each obj in model.object}}

It seems that model.object is a Javascript object, not an array. The each loop only iterates or arrays (and possibly array-like objects), not arbitrary Javascript objects. If you want to iterate over the keys and values of an object, you'll have to create a computed property to do it.

Upvotes: 2

Related Questions