Question

我想突出显示树中当前选定的节点。这意味着我想取消先前选择的节点（如果有的话）。我不想访问整个树，如果已经选择，则取消选择该节点。

请在http://plnkr.co/edit/2a9srm7QDYcXhXD2JmrR?p=preview

查找当前的实施情况

你能用更好的方法帮助我吗？

我试图避免整个树遍历（在最糟糕的情况下），以便不突出显示一个先前选择的节点。

感谢。

Answer 1

您可以在TreeController中拥有一个属性来存储当前选定的节点。然后，您可以将该属性（因为您具有隔离范围，通过双向数据绑定）传递给所有expandableTree实例（以便所有实例共享一个公共属性：当前选定的节点）。

然后你应该改变ngClass exression以检查当前节点是否是所选节点，例如：

ng-class="{blueBase:node===<propDenotingCurrentlySelectedNode>}"

有一点需要注意的是，由于prorotypal继承的工作原理以及为了强制每个范围使用继承的属性（而不是在本地覆盖它），你不应该直接传递属性，而是一个对象（这是属于财产）。 E.g：

/* In TreeController */
$scope.cfg = {};

<!-- In the VIEW -->
<expandable-tree family="..." cfg="cfg"></expandable-tree>

/* In the DIRECTIVE */
...
scope: {
    ...
    cfg: '='
},
controller: function (...) {
    ...
    $scope.selectNodeLabel = function (node) {
        ...
        $scope.cfg.currentNode = node;
    }
    ...
},
template:
    '...' +
    '<label ... ng-class="{blueBase:node===cfg.currentNode}" ...' +
    '...' +
    '    <p><expandable-tree family="node" cfg="cfg"></expandable-tree></p>' +
    '    ...' +
    '        <label ... ng-class="{blueBase:step===cfg.currentNode}" ...' +
    '...',
...

另请参阅此 modified demo 。

突出显示可扩展树angularJS中当前选定的节点

1 个答案: