Get length of current array in recursive ng-repeat

Question

Have a look in this fiddle http://jsfiddle.net/uXbn6/4619/

Here I have used recursive templates for printing my data. What I want is 'Hi' text should only get printed only when correspondind array length is greater than 1.

Here for first array 'tree', as length is greater than 1, Hi should be printed. Now in child when repeat loops on data.nodes, as length of data.nodes is 1 or less than 1, 'Hi' should not be get printed.

In short I want output like this for this example

firstParenNode Hi
node1.1
secondParenNode Hi

<script type="text/ng-template" id="tree_item_renderer.html">
 <div> {{data.name}}
 <span ng-show="tree.length > 1"> Hi </span>
 </div>
 <div ng-repeat="data in data.nodes" ng-include="'tree_item_renderer.html'"></div>
 </script>
<div ng-app="myApp" ng-controller="TreeController">
 <div ng-repeat="data in tree" ng-include="'tree_item_renderer.html'"></div>
</div>
angular.module("myApp", []).
controller("TreeController", ['$scope', function($scope) {
 $scope.tree = [{
 name: "firstParenNode", 
 nodes: [{
 name: "node1.1",
 nodes: []
 }]
 }, {
 name: "secondParenNode",
 nodes: []
 }];
}]);

Any Help would be appreciated.

Answer 1

Try it:

<script type="text/ng-template" id="tree_item_renderer.html">
 <div> {{node.name}} 
 <span ng-show="node.nodes.length > 0"> Hi </span>
 </div>
 <div ng-repeat="node in node.nodes" ng-inlude="'tree_item_renderer.html'"></div>
</script>
<div ng-app="myApp" ng-controller="TreeController">
 <div ng-repeat="data in tree">
 <div> {{data.name}}
 <span ng-show="tree.length > 1"> Hi </span>
 </div>
 <div ng-repeat="node in data.nodes" ng-include="'tree_item_renderer.html'"></div>
 </div>
</div>

See on my Fiddle: http://jsfiddle.net/uXbn6/4622/

• csp713: OP said he wants 'Hi' to print if the node length is greater than 1, not 0. With that in mind this solution prints 'Hi' on a parent node even if there were not more than 1.
• Dmitry Stepanov: He want output "secondParenNode Hi". How it possibly in that conditions? secondParenNode length is not greater than 1
• Dmitry Stepanov: aah, now i understand. I edit my answer. In 12 string add "ng-show = tree.length>1"

Answer 2

If I understand correctly, just replace

<span ng-show="tree.length > 1"> Hi </span>

with

<span ng-show="data.nodes.length > 1"> Hi </span>.

• Kiran Shinde: But what about parent array, i.e. '$scope.tree', If I replace it, as you suggested it will show Hi only on child nodes not on root node
• Kiran Shinde: It should print 'Hi', if the current looping array has length greater than 1
• csp713: Right now it looks like $scope.tree is not a node itself, but rather an array of objects. Each object is an actual node with a name and an array of child nodes. My suggestion should print what your example shows.
• Kiran Shinde: No, its not printing what I have, See in question, I have added desired output in my question, your suggestion is not printing 'Hi' at all
• csp713: That's because none of the nodes arrays have length > 1. Like I said, $scope.tree is not being printed; it is not a node. Perhaps you want the length of the parent array's nodes instead of current? In which case you'll probably want to change your array structure to have one root node object with a name and nodes array which contains all other nodes.