Javascript angularjs服务生成数据后如何停止？

我编写了一个angularjs服务，它使用下面显示的函数从“平面”数组生成树状数组。 此服务作为控制器的依赖项注入（见下文），并通过服务对象中返回的get（）方法绑定到作用域

var arr = [
  {"id": 1, "firstName": "Macko","parentId": 12},
  {"id": 2, "firstName": "Jess","parentId": 1},
  {"id": 3, "firstName": "Peter","parentId": 1},
  {"id": 4, "firstName": "Lisa", "parentId": 1},
  {"id": 5, "firstName": "Megan","parentId": 1},
  {"id": 6, "firstName": "John", "parentId": 4},
  {"id": 7, "firstName": "Joe", "parentId": 4},
  {"id": 8, "firstName": "Matthew","parentId": 2},
  {"id": 9, "firstName": "Peter","parentId": 2},
  {"id": 10, "firstName": "Dio","parentId": 5},
  {"id": 11, "firstName": "Hello","parentId": 5},
  {"id": 12, "firstName": "Ana", "parentId": 4}
];

var getNestedChildren = function(arr, id, checked) {

  var out = [];
  for (var i = 0; i < arr.length; i++) {
    if (arr[i].parentId === id && checked.indexOf(arr[i].id) === -1) {
      checked.push(id);
      var children = getNestedChildren(arr, arr[i].id, checked);
      if (children.length) {
        arr[i].children = children;
      }
      out.push(arr[i]);
    }
  }
  return out;

};

return {

       get: function (element) {
            return getNestedChildren(arr, element.id, []);
       }

}

当我切换路由几次以查看不同参数的树时，创建的树每次都有更多的元素，直到在某个点返回错误

Error: [$rootScope:infdig] 10 $digest() iterations reached. Aborting! 

我的猜测是，因为myService是一个单例，它通过路由保持状态，这就是为什么我得到不一致的数据

我怎样才能阻止这种行为？可能在生成特定树后重置服务

请帮忙

编辑： 我试图在离开特定视图时清理$templateCache和$scope，但没有效果。到目前为止，只有浏览器刷新显示正确的树后，切换几个路线

根据显示呈现树的html的请求：

指令

angular.module('app').directive('showTree', [function () {

        return {
            restrict: 'E',
            templateUrl: 'app/tree/tree.tpl.html'
        }

    }]);

tree.tpl.html:

<h3> {{selectedElement.firstName}} {{selectedElement.lastName}}"></h3>
<ul>
    <li ng-repeat="element in tree" ng-include="'tree'"></li>
</ul>

<script type="text/ng-template" id="tree">
    <h3> {{element.firstName}} {{element.lastName}}"></h3>
    <ul>
        <li ng-repeat="element in element.children" ng-include="'tree'"></li>
    </ul>
</script>

---

10个摘要循环意味着您在连续的angular循环中连续10次检测angular的变化

此外，我没有看到任何让人认为你的服务保留了任何州

---

我想你的树上确实有点问题，但不是你在这里发布的内容。向我们展示显示树和控件的HTML。

查看我想我找到了它删除id 12的行，并告诉我如果再次发生，您的树中有一个循环<代码>12它不会，但它必须在那里。这是循环引用树，递归函数在找到它开始使用的id之前停止生成树。哼，可能是级别太多了吧？首先尝试不使用循环，但只使用4或5个级别。不是所有的东西都适合。也许开发您自己的指令，使用一些jQuery树或任何幕后组件会更好。当不处理循环引用时，它工作得很好。有趣的是，若我在视图中刷新页面时呈现错误，那个么它会正确地重新呈现。

<h3> {{selectedElement.firstName}} {{selectedElement.lastName}}"></h3>
<ul>
    <li ng-repeat="element in tree" ng-include="'tree'"></li>
</ul>

<script type="text/ng-template" id="tree">
    <h3> {{element.firstName}} {{element.lastName}}"></h3>
    <ul>
        <li ng-repeat="element in element.children" ng-include="'tree'"></li>
    </ul>
</script>

angular.module('app')
        .controller('TreeController', ['$scope', '$routeParams', 'ElementFactory', 'myService',
            function ($scope, $routeParams, ElementFactory, myService) {

                $scope.selectedElement = ElementFactory.get({elementId: $routeParams.elementId});

                $scope.tree = myService.get({elementId: $routeParams.elementId});

            }]);