nickperkinslondon 角度树视图 expand_all() 问题答案

【问题标题】：nickperkinslondon angular treeview expand_all() problemsnickperkinslondon 角度树视图 expand_all() 问题
【发布时间】：2017-10-19 14:36:43
【问题描述】：

我正在使用这个角度树视图项目：

https://github.com/nickperkinslondon/angular-bootstrap-nav-tree

我认为这个树形视图没有对树形视图进行搜索的功能，所以我使用一个表单来实现我的功能来编写要查找的标签。

<form name="searchForm" novalidate style="margin-bottom: 50px">
    <div> <input ng-model="search" type="text" class="form-control" placeholder="Buscar..." name="searchTerm" required /> 
    </div> 
</form>

这个表单有一个 .watch 来检测用户何时写了一些文本：

$scope.$watch('search', function(newTerm, oldTerm) {
        filteredResponse = !newTerm ? response : updateFilteredResponse(normalize(newTerm));
        updateTree();
 }, true);

函数 'updateFilteredResponse' 过滤带有标签的节点，标签包含 newTerm 在原始数据集（从 json 读取）上，并返回一个数组，其中包含要在树视图中显示的项目。

“updateTree”函数使用此数组并将数组中的自定义项转换为树视图项以添加到树视图中。此项目已添加到 $scope.tree_data = [];

而这个数组就是使用 abn-tree 指令的数组：

<abn-tree tree-data="tree_data" tree-control="my_tree" ng-if="loaded" expand-level = "2"></abn-tree>

这部分工作正常。当结果树视图显示在屏幕上时，我的问题出现了，树视图总是完全折叠。

如果我像这样放置一个类似于库示例代码的按钮：

<div style="vertical-align:top">
     <button ng-click="my_tree.expand_all()" class="btn btn-default btn-sm">Expand All</button>
</div>

并在控制器中声明这个作为例子：

var tree;
$scope.my_tree = tree = {};

当用户单击按钮以展开整个搜索结果时，它可以正常工作。通过我需要在搜索后自动展开树视图，并删除全部展开按钮。

为此，我试图在我的控制器中调用 my_tree.expand_all()。我尝试了不同的调用：

$scope.my_tree.expand_all();
tree.expand_all();

在我的控制器和我的 html 的不同部分（使用 ngIf 和 onload 指令）。即使我尝试对 $scope.my_tree 进行“监视”，以便在准备 var 时尝试使用 expand_all() 函数，但我总是遇到同样的错误：

$scope.my_tree.expand_all is not a function

谁能帮帮我？

【问题讨论】：

标签： javascript angular treeview

【解决方案1】：

您可以将expand_all() 函数放入setTimeout 函数中，如下所示。

   setTimeout(function() {            
        $scope.my_tree.expand_all();
        $scope.$digest();
   }, 0);

必须这样做，因为在将数据绑定到树视图时需要一些延迟时间。

【讨论】：