Lets say we have two ng-repeat (nested) in angularJS:
<div ng-repeat="animal of animals track by $index">
<div ng-repeat="name in names">
<p>{{$index}}</p>
</div>
</div>
In this example the $index would be the index of the child loop in names, but i want to have the index of the parent loop animals where i have the track by.
Why is this not working?
Try this.
<div ng-repeat="animal of animals track by $index">
<div ng-repeat="name in names">
<p>{{$parent.$index}}</p>
</div>
</div>
Related
I want to access the index of dashboardCtrl.labels in dashboardCtrl.labelColors which is another array.I have tried the following but no success. If I print just {{$index}} it is getting printed successfully}}
<div class="row" ng-repeat="i in dashboardCtrl.labels">
<div id="circle" style="background:green"></div>{{i}}
<label>{{dashboardCtrl.labelColors[{{$index}}]}}</label>
</div>
You don't need nested brackets {{ }}. Try this
<div class="row" ng-repeat="i in dashboardCtrl.labels">
<div id="circle" style="background:green"></div>{{i}}
<label>{{dashboardCtrl.labelColors[$index]}}</label>
</div>
Do the following. Just $index in {{dashboardCtrl.labelColors[$index]}} instead of {{dashboardCtrl.labelColors[{{$index}}]}}
<div class="row" ng-repeat="i in dashboardCtrl.labels">
<div id="circle" style="background:green"></div>{{i}}
<label>{{dashboardCtrl.labelColors[$index]}}</label>
</div>
EDIT
Apply CSS style attribute dynamically in Angular JS
ng-style="{'background-color': dashboardCtrl.labelColors[$index]}"
I need to get the value of the 2D array on this code using ng-repeat.
<div ng-repeat="n in status">
<div ng-repeat="x in n track by $index">
{{n}}
</div>
</div>
my array is
$scope.status = [{1,2,4},{4,5,6,7},{8,9}];
right now i am getting the value of the array but with quotation and array bracket
["1","2","3"]
["4","5","6","7"]
["8","9"]
HELP PLEASE
Do you mean to display x? n is an array just as you're seeing.
<div ng-repeat="n in status">
<div ng-repeat="x in n track by $index">
{{x}}
</div>
</div>
As I can access a specific property it is a nested ng-repeat this is my code:
<div ng-repeat="item in list">
<div ng-repeat="(key, value) in item">
{{key}}:{{value}}
</div>
</div>
So far so good, I want to do is get the value of a particular property to another action
with that, that is a comparison to something more like this:
<div ng-repeat="item in list">
<div ng-repeat="(key, value) in item">
<div ng-if="key.myProperty==1">
//My Code
</div>
<div ng-if="key.miProperty==2">
//My Code
</div>
</div>
</div>
My object is:
$scope.list = [{id:1,name:"name1",age:"22"},{id:2,name:"name1",age:"25"},{id:2,name:"name1",age:"25"}];
I want to get the value of age.
Any suggestions.
IF you just simply need the age value in the repeat, then you do not need the inner repeat, all you need is
<div ng-repeat="item in list">
{{item.age}}
</div>
Unless I am missing something here, you can simply just do this. Here's a fiddle for you - http://jsfiddle.net/7MhLd/1298/
So unless you need this to build dynamically off the data, you would just do :
<div ng-repeat="item in list">
id: {{item.id}}
age: {{item.age}}
name: {{item.name}}
</div>
I'm not quite sure what you're trying to say with key.myProperty because as was mentioned, key is a string. If you want to check if the age is a certain value you can do something like.
<div ng-if="key === 'age' && value === '1'">
I have two ng-repeats, one inside the other.
<table ng-repeat="all in values track by $index">
<tr ng-repeat = "errors in all track by $index">
// I want to use the $index of both ng-repeats
</tr>
</table>
I have to use the $index of both the ng-repeats. How can I distinguish one $index from the other?
When using $parent.$index for getting the parents index:
<div ng-app="myApp">
<div ng-controller="myCtrl">
<div ng-repeat="data in parent track by $index">
<div ng-repeat="data1 in data track by $index">
{{$parent.$index}}:{{$index}}
</div>
</div>
</div>
</div>
Where myApp is:
angular
.module('myApp',[])
.controller('myCtrl',function($scope){
$scope.parent = [
['a','e','i','o','u'],
['a1','e1','i1','o1','u1'],
['a2','e2','i2','o2','u2'],
];
});
You can have a look at more details in this jsbin.
This is my controller
mode.controller("array_l",['$scope',function($scope){
$scope.items=[1,2,3,4,5];
//console.log( $scope.items);
}]);
This is my HTML
<div ng-controller="array_l" ng-repeat="item in items">
{{item}}
</div>
ng-repeat not showing any value
given controller and html
Move your ng-controller directive before your ng-repeat block.
Use track by $index in your ng-repeat to avoid problems with duplicate elements.
angular.module('mode',[])
.controller("array_l",['$scope',function($scope){
$scope.items=[1,2,3,1];
}]);
HTML:
<div ng-app="mode" ng-controller="array_l">
<div ng-repeat="item in items track by $index">
{{item}}
</div>
</div>
<div ng-repeat="item in items">
{{item}}
</div>
Defiantly worth reading through the Angular docs.