wix-incubator / angular-tree-control

Angular JS Tree
http://wix.github.io/angular-tree-control
MIT License
707 stars 276 forks source link

Load children asynchronous with on-node-toggle #240

Closed inquota closed 8 years ago

inquota commented 8 years ago

Hi, At this moment I am able to load the children asynchronous with the toggle function. The weird thing is, the children will be displayed on the 2nd click.

The treecontrol got this value: on-node-toggle="ctrl.fetchChildNodes(node, expanded)"

This is my Angular method:

controllerScope.fetchChildNodes = function (node, expanded) {
                    if(expanded) {
                        if (node.hasOwnProperty('hasChildren')) {
                            var token = jQuery('meta[name="csrf_token"]').attr('content');
                            jQuery.ajax({
                                    method: 'POST',
                                    headers: {'X-XSRF-TOKEN': token},
                                    url: '/ajax/nodes/children',
                                    data: {
                                        nodeId: node.id
                                    }
                                })
                                .success(function (data) {
                                    node.children = data;
                                })
                                .done(function (data) {
                                    node.children = data;
                                })
                                .fail()
                        }
                    }
                };

Why does the data only be showed on the 2nd click?

https://www.dropbox.com/s/ynunsrpcgu24vfp/angular-tree-control-lazy-load.png?dl=0

Thanks!

yoavaa commented 8 years ago

you need to use $scope.$apply() in the ajax callback.

inquota commented 8 years ago

Thanks, issue solved :)