Question

我们正在尝试Angular-NestedSortable https://github.com/subvertnormality/Angular-NestedSortable（angular-ui-tree的版本2看起来不稳定，看着测试）。
我们想通过REST加载树结构，然后折叠根节点此外，我们希望在扩展项目时发出其他REST请求。我们遇到了问题，因为NestedSortable使用了大量嵌套的Angular范围，我们不了解如何访问诸如collapseAll（）之类的API方法或如何重载toggle（）。
有人可以提供一个例子小提琴或笨蛋吗？这不起作用： $scope.list = [...]; $scope.collapseAll(); 因为collapseAll未在外部范围中定义...

Answer 1

你可以这样做，使用treeView节点创建模板。

重要提示：

callRestService（） //函数

data-collapsed =“node.collapsed” //设置为true或false，node。已折叠是您模型的主要内容

< / LI>

示例：

<script type="text/ng-template" id="tree_nodes.html">
    <div ui-tree-handle class="tree-node tree-node-content" ng-mouseover="showButtons=true" ng-mouseleave="showButtons=false">
        <a style="cursor:pointer;" data-nodrag ng-click="toggle(this); callRestService(this)">
            <span class="glyphicon" ng-class="{'glyphicon-chevron-right': collapsed, 'glyphicon-chevron-down': !collapsed}"></span>
        </a>
        {{node.Name}}
        <a ng-show="showButtons" class="pull-right" style="cursor:pointer;" data-nodrag ng-click="remove(this)"><span class="glyphicon glyphicon-remove"></span></a>
        <a ng-show="showButtons" class="pull-right" style="cursor:pointer;margin-right: 8px;" data-nodrag ng-click="newSubItem(this)"><span class="glyphicon glyphicon-plus"></span></a>
    </div>
    <ol ui-tree-nodes ng-model="node.nodes" ng-class="{hidden: collapsed}">
        <li ng-repeat="node in node.nodes" data-collapsed="node.collapsed" ui-tree-node ng-include="'tree_nodes.html'">
        </li>
    </ol>
</script>

<div ui-tree id="tree-root">
    <ol ui-tree-nodes="" ng-model="data">
        <li ng-repeat="node in data" ui-tree-node data-collapsed="node.collapsed" ng-include="'tree_nodes.html'"></li>
    </ol>
</div>

折叠Angular-NestedSortable / angular-ui-tree的项目

1 个答案: