如何折叠每个角用户界面树的所有函数

Question

对于角用户界面树，我想添加解释或折叠所有。

我尝试了下面的代码，它起作用了。

 $scope.collapseAll = function () {
        $scope.$broadcast('angular-ui-tree:collapse-all');
      };

  $scope.expandAll = function () {
    $scope.$broadcast('angular-ui-tree:expand-all');
  };
  ...

问题是，我的页面有多个ui树，我只想单独触发expandAll函数。现在我触发这个expandAll函数。所有的 ui -tree都会受到影响。

是否有任何解决方案将每一个分别设置为单独的？

如何在角用户界面树上调用collapseAll函数？

Answer 1

如果您检查角ui树的来源，则'angular-ui-tree:collapse-all'事件将切换一个范围值。其他问题是角ui树中的每个指令都继承了父函数的作用域，而不是单独的作用域。因此，当您广播一个事件时，更改它实际上是在更改相同的作用域值。

您应该找到一种方法，让每棵树都有一个单独的作用域，或者考虑使用类似于V-手风琴的其他树。

Answer 2

我们应该广播角-ui-树:折叠-所有指定的树范围。它的工作是me.you可以毫不迟疑地使用它。

    function collapseAll() {
        var treeScope = _getRootNodesScope('myTreeId');
        if (treeScope) {
            treeScope.$broadcast('angular-ui-tree:collapse-all');
        }
    }


 function expandAll() {
        var treeScope = _getRootNodesScope('userTreeroot');
        if (treeScope) {
            treeScope.$broadcast('angular-ui-tree:expand-all');
        }
    }

  function _getRootNodesScope(myTreeId) {
 var treeElement = angular.element(document.getElementById(myTreeId));
 if (treeElement) {
 var treeScope = (typeof treeElement.scope === 'function') ? 
 treeElement.scope() : undefined;
            return treeScope;
        }
        return undefined;
    };