Javascript 角度ABN树：如何从代码中选择元素？

我正在使用，我想从代码中选择一个特定的元素，主要是为了实现搜索功能

我尝试在相关元素上设置“selected”属性。这只是部分起作用：元素被选中，但当用户单击另一个元素时，它不会被取消选中

在源代码中，我看到ABN树内部有一个select_分支函数。然而，我还没有弄明白如何从外部访问它——我无法获得范围的引用

---

那么，我该怎么做呢？我对使用不同的树控件持开放态度。

您可以将“选择文本”属性添加到树中，并将“选择文本”绑定到模型。e、 g

<abn-tree tree-data="my_data" on-select="my_tree_handler(branch)" select-text="textToSelect"></abn-tree>

然后在指令中的return语句之前，添加以下代码

scope.$watch('selectText', function() {
    if (scope.selectText) {
      for_each_branch(function (b) {
        if (b.label === scope.selectText) {
          return select_branch(b);
        }
      });
    }
  });

现在，将模型的文本设置为您想要的值，它应该在树中选择它，并调用您可能在树上设置的任何选择处理程序

---

希望这有帮助。

我已经更改了上面的代码（可能是这个版本的abn树代码失败了），通过这些更改，您可以按id或标题选择节点。希望有帮助：）

在abn_树源js文件中，将范围更改为：

 scope: {
              treeData: '=',
              onSelect: '&',
              onDblSelect: '&',
              initialSelection: '=',
              selectedText: '=',//parichehr
              selectedId: '=',//parichehr
              treeControl: '=',
              labelFiled: '=',
              idFiled: '=',//parichehr
              childrenField: '='
          },

然后添加以下部分链接：函数

 link: function (scope, element, attrs) {

              scope.label = scope.labelFiled || 'Title';
              scope.id = scope.idFiled || 'Id';//parichehr
              scope.children = scope.childrenField || 'Children';

然后将此部分添加到下面的TreeDataWatcher…：

  var treeDataWatcher = scope.$watch('treeData', onTreeDataChange, true);
              //parichehr start
              var selectedTextWatcher = scope.$watch('selectedText', function () {
                  if (scope.selectedText) {
                      forEachBranch(function (b) {
                          if (b[scope.label] === scope.selectedText) {
                              return selectBranch(b);
                          }
                      });
                  }
              });
              var selectedIdWatcher = scope.$watch('selectedId', function () {
                  if (scope.selectedId) {
                      forEachBranch(function (b) {
                          if (b[scope.id] === scope.selectedId) {
                              return selectBranch(b);
                          }
                      });
                  }
              });
              //parichehr end

最后，在最后处置观察者：

scope.$on('$destroy', function() {
                  if (treeDataWatcher) treeDataWatcher();
                  if (initialWatcher) initialWatcher();
                  //parichehr start
                  if (selectedTextWatcher) selectedTextWatcher();
                  if (selectedIdWatcher) selectedIdWatcher();
                  //parichehr end
              });

在html中，您将有以下更改： 如果要按节点标题选择：

<abn-tree tree-data="my_data" on-select="my_tree_handler(branch)" selected-text="textToSelect"></abn-tree>

如果要选择“按节点id”：

<abn-tree tree-data="my_data" on-select="my_tree_handler(branch)" selected-id="idToSelect"></abn-tree>

这应该被选为答案。你还在使用abn tree吗？@Batman-不，我们在结尾处抛弃了ABan tree。你找到其他你认为有效的方法了吗？似乎没有太多的选择。

<abn-tree tree-data="my_data" on-select="my_tree_handler(branch)" selected-id="idToSelect"></abn-tree>