CODEWITHSUNDEEP
angularjs
Sushil Gupta
Sushil Gupta

Reputation: 97

Add double click event on child node in angular-tree-widget

I am new to angular-tree-widget.js. We need to implement double click event once we click on any tree child node. All I found only two events are supported. 

$scope.$on('selection-changed', function (e, node) {
    //node - selected node in tree
    $scope.selectedNode = node;
});
$scope.$on('expanded-state-changed', function (e, node) {
    // node - the node on which the expanded state changed
    // to see the current state check the expanded property
    //console.log(node.expanded);
    $scope.exapndedNode = node;    
});

How do I add double click event on a node here? Please help me. Thanks in advance.

Upvotes: 3

Views: 1519

Answers (1)

Vadim
Vadim

Reputation: 8789

You can add ng-dblclick, as @Manikandan suggested, in the following way:

HTML

<body ng-controller="TreeController" ng-dblclick="dblclick($event)">
    <tree nodes='treeFamily'></tree>
</body>

JavaScript

controller('TreeController', ['$scope', function ($scope) {
    $scope.dblclick = function(evt) {
      angular.element(evt.target).toggleClass('red')
    }
    ...
}])

Live Demo

https://plnkr.co/edit/nWfiDA82WDpgRGnLqJUs?p=preview

As you can see, the idea is to subscribe to event on parent element of the tree and distinguish between tree items using evt.target, which is passed to event handler using angular's $event

Upvotes: 1

Related Questions