angularjs 如何折叠每个Angular UI树上所有功能

kmynzznz  于 2022-11-28  发布在  Angular
关注(0)|答案(2)|浏览(157)

对于Angular ui-tree,我想添加全部展开或全部折叠。
我尝试了下面的代码,它的工作。

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

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

问题是,我的页面有多个用户界面树,我只想触发expandAll函数来分开。现在我触发了这个expandAll函数。ALLui -tree将受到影响。
有没有办法把每一个都设置成单独的?
How to call collapseAll function on Angular UI tree?

hzbexzde

hzbexzde1#

如果你在angular-ui-tree的Source处检查,'angular-ui-tree:collapse-all'事件会切换一个作用域值。另一个问题是angular-ui-tree中的每个指令都继承了父级的作用域,而不是拥有一个独立的作用域。因此,当你广播一个事件时,改变实际上是改变同一个作用域值。
你应该找到一种方法,让每个树都有一个单独的作用域,或者考虑使用一些其他的树,比如v-accordion

ffx8fchx

ffx8fchx2#

我们应该在指定的树范围内广播angular-ui-tree:collapse-all。这对www.example.com是有效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;
    };

相关问题