2017-04-13 1 views
0

角度ui-treeの場合、explandをすべて追加するか、すべてを折りたたみたい。角度UIツリーごとにすべての機能を折りたたむ方法

私は次のコードを試してみました。

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

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

私のページには複数のUIツリーがありますが、私は別々のexpandAll関数をトリガーしたいだけです。今私はこのexpandAll関数をトリガーします。 ALL ui -treeが影響を受けます。

それぞれを個別に設定する方法はありますか?

How to call collapseAll function on Angular UI tree?

答えて

1

あなたは、角UIツリーのSourceでチェックすると、'angular-ui-tree:collapse-all'イベントは、スコープ値を切り替えます。 angle-ui-treeの各ディレクティブは、独立したスコープを持つよりも親のスコープを継承しています。したがって、イベントをブロードキャストするときは、実際には同じスコープ値を変更しています。

それぞれのツリーが別のスコープを持つ方法を見つけるか、v-accordionのような他のツリーを使用する方法を検討する必要があります。

+1

ご返信ありがとうございます。 v-accordionは素晴らしいプラグインですが、後でそれを使用することを検討します。とにかく、whileループを使って再帰的にchildNodeを取得して解決することができます。ありがとう –

0

指定されたツリースコープに対して、angular-ui-tree:collapse-allをブロードキャストする必要があります。 それは私のための仕事です。あなたはまったく迷わずに使用できます。

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; 
    }; 
関連する問題