How to access the items with square braces using ng-repeat in angularjs

Question

I can't access some items in nested collection.

The array:

$scope.myArray = {
    "pm_id": 2,
    "type": "Scrum",
    "estimated_end_date": "Wednesday, March 15, 2017",
    "no_of_sprints": 2,
    "status": "Not Started",
    "created_by": "[email protected]",
    "sprint": [
        {
            "s_id": 4,
            "p_id": 35,
            "sprint_stage": "Sprint 1",
            "sprint_requirement_[1]": "<p>description goes here </p>",
            "sprint_start_date_[1]": "Monday, March 13, 2017",
            "sprint_end_date_[1]": "Friday, March 17, 2017"
        }, 
        {
            "s_id": 5,
            "p_id": 35,
            "sprint_stage": "Sprint 2",
            "sprint_requirement_[2]": "<p>description goes here </p>",
            "sprint_start_date_[2]": "Monday, March 20, 2017",
            "sprint_end_date_[2]": "Friday, March 24, 2017"
        }
    ]
} 

HTML with ng-repeat:-

<p ng-repeat="y in myArray">
<p ng-repeat="x in myArray.sprint">{{x.p_id}} , {{x.sprint_requirement_[1]}}</p></p>

{{x.p_id}} is working fine, but the {{x.sprint_requirement_[1]}} is getting blank.

Can anyone let me know what I'm missing?

Answer 1

Try:

<p ng-repeat="x in myArray.sprint">{{ x.p_id }}, {{ x['sprint_requirement_[' + ($index + 1) + ']'] }}</p>

Also, the external ng-repeat seems superfluous to me.

Explanation: in Javascript, you can access object properties both using the dot operator and the square bracket syntax.