I need to repeat over a deeply nested javascript object in my angular template. The problem is that I have no control over how the data is handed to me, and no way of knowing how deeply nested the data will be.
The data looks like this
{
category_name: 'cat1'
children: [
{
category_name: 'cat1a',
children: [...]
}
]
}
And the template
<div ng-repeat="cat in categories">
<div ng-repeat="subcat in cat.children">
{{subcat.name}}
<!--
would like to programatically place an ng-repeat here too
if subcat.children.length > 0
-->
</div>
{{cat.name}}
</div>
This checks two levels deep, but how can I recursively repeat until there are no children left? I'm thinking I need to create a custom directive that compiles a new ng-repeat as required, I'm just not sure how to go about it.