html not rendered in ng-template angular - angularjs

Question

I have some jsons data such as below, when I tried to print them recursively with ng-include and ng-template (as shown below), the ng-include's inside html codes doesnot rendered and it is blank.
and other problem is that in printing ng-include , it just print 1 level of recursion and it doesn't keeping on printing.
so what's wrong?
Json data:
[{"name":"default","path":">var>www>rapa-v2>themes>","subdir":[{"name":"css","path":">var>www>rapa-v2>themes>>default","subdir":[{"name":"images","path":">var>www>rapa-v2>themes>>default>css","subdir":[]},{"name":"style.css","path":">var>www>rapa-v2>themes>>default>css"}]},{"name":"index.blade.php","path":">var>www>rapa-v2>themes>>default"},{"name":"information.json","path":">var>www>rapa-v2>themes>>default"},{"name":"screen.jpg","path":">var>www>rapa-v2>themes>>default"}]}]
Html code:
<div class="theme-files-list ltr" ng-init="loadDir('{{ $theme }}')">
<script type="text/ng-template" id="directoryTree">
<div class="tree-item">
<i class="fa fa-file-text-o maroon"></i>
<a href="<% '/admin/setting/template/edit/{{ $theme }}/'+item.name %>">
<% item.name %>
</a>
</div>
<ul ng-if="item.subdir">
<li ng-repeat="item in item.subdir" ng-include="'directoryTree'"></li>
</ul>
</script>
<ul class="noselect">
<li>
<div class="tree-item bg-aqua">
<i class="fa fa-paint-brush blue"></i>
{{ ucfirst($theme) }}
</div>
<ul>
<li ng-repeat="item in themeDir" ng-include="'directoryTree'"></li>
</ul>
</li>
</ul>
</div>
important: I use laravel and for blade system print, I have replaced angular print symbols {{ }} with <% %>

Answer 1

I think you have to use different code. Your json represent a tree of folder but in the angular app, you're only iterating on the first level and in the first level you have only 1 item with subdir.
If you format correctly your json response you can easily understand this.
[
{
"name":"default",
"path":">var>www>rapa-v2>themes>",
"subdir":
[
{
******** You're targeting this element below **********
"name":"css",
"path":">var>www>rapa-v2>themes>>default",
"subdir":
[
{
"name":"images",
"path":">var>www>rapa-v2>themes>>default>css",
"subdir":[]
},
{
"name":"style.css",
"path":">var>www>rapa-v2>themes>>default>css"
}
]
},
{
******** This doesn't has subdir **********
"name":"index.blade.php",
"path":">var>www>rapa-v2>themes>>default"
},
{
******** This doesn't has subdir **********
"name":"information.json",
"path":">var>www>rapa-v2>themes>>default"
},
{
******** This doesn't has subdir **********
"name":"screen.jpg",
"path":">var>www>rapa-v2>themes>>default"
}
]
}
]
So you have to change the json or to change ng-repeat