html not rendered in ng-template angular

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('')">
    <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//'+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>
            
          </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 <% %>

via menhajrrt