Using a scope variable to index a scope array in ng-repeat?

Question

I have a tree like structure, received as JSON from some PHP code which I wrote for my server.

The code is far to complex to post, so let's use an example:

A company has

multiple departments, each of which has 0..n
- jobs, each of which has 0..n
  - people

So, I can find myself with something like

$scope.departments[1].jobs[1].people[1]
$scope.departments[1].jobs[1].people[2]

etc

I have $scope variable for the current user-selected department, job and person.

My problem is where I want to use an ng-repeat of the jobs in the HTML view for the jobs.

The statement

<div ng-repeat="job in departments[{{departmentId}}].jobs>

gives Error: [$parse:syntax], as does

<div ng-repeat="job in departments[$scope.departmentId].jobs>

(which I tried in desperation).

What is the correct syntax?

I am wondering if I will need to try

<div ng-repeat="job in GetJobsForCurrentDepartment()>

since $scope.departmentId would be in scope in my controller, but is not in the HTML view for the departments.

you could make your last option workable, by passing departmentId in GetJobsForCurrentDepartment function like <div ng-repeat="job in GetJobsForCurrentDepartment(departmentId)> — Pankaj Parkar
– Pankaj Parkar, Commented Nov 29, 2015 at 16:25

Vivek · Accepted Answer · 2015-11-29 16:31:50Z

2

Since a view has a controller associated with it, and controller has a $scope associated with it. It is not required to use $scope the html element for referencing the variables defined in the controller. Any variable used with a element in a view is looked up in the scope associated with that element. $scope is required only in the script.

Thus you can write

<div ng-repeat="job in departments[departmentId].jobs>

This will fetch the value of departmentId & jobs inside it will be processed by the ng-repeat directive.

answered Nov 29, 2015 at 16:31

Vivek

13.6k19 gold badges101 silver badges140 bronze badges

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

4 Comments

Mawg Over a year ago

How does departmentId get resolved, if I don't make it {{departmentId}}? I will try it and get back to you

Vivek Over a year ago

Expression syntax {{ }} is only required when 1] You want to bind its value to an element. 2] When you want to perform logical operation like <span> 1+2={{1+2}} </span> . In your case it is not required since ng-repeat is already a directive.

Vivek Over a year ago

@Mawg Please accept the answer if it worked for you.

Mawg Over a year ago

Of course I will (+1). Sorry, a family emergency meant that I could not try it at home. I am now in the office and - while test are running - putting together a fiddle to test it, which I will then link to in order to help future viewers of this question. Please bare with me :-)

Anik Islam Abhi · Accepted Answer · 2015-11-29 16:14:35Z

1

You don't have to mention $scope attached with a varable in view

try like this

<div ng-repeat="job in departments[departmentId].jobs>

JS

$scope.departmentId=1;

answered Nov 29, 2015 at 16:14

Anik Islam Abhi

25.4k8 gold badges61 silver badges82 bronze badges

Collectives™ on Stack Overflow

Using a scope variable to index a scope array in ng-repeat?

2 Answers 2

4 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

4 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related