ivhTreeView的指令链接功能未触发控制器的功能

时间:2018-09-17 09:35:54

标签: angularjs angularjs-directive angularjs-scope

单击折叠的扭曲图标时,无法从getChildrenNodes()伪指令中调用控制器函数leafExpanded

这是我的控制器:

    function EzReportConfigController($scope, $element, $attrs, $http, runReportService, userEmailService, cronSchedulerService, ParentListService, localiser, ivhTreeviewOptions) {
    var that = this;

     $scope.nodes = ParentListService.parentNode;
     var data = $scope.nodes;

     data[0].children = [{
             code: "002",
             name: "loading..",
             fakechildren: true
     }];

    //loading only nodes in data
     $scope.nodeid = $scope.nodes[0].Code;

    $scope.addCheckState = function (data) {
        for (var i = 0; i < data.length; i++) {
            if (data[i].hasOwnProperty("HasChecked") == false) {
                data[i].HasChecked = true;
            }
        }
    }

    $scope.addCheckState(data);
     $scope.getChildrenNodes = function (nodeid) {
         debugger;
        $http.post("Report/GetChildTreeNodes", { directoryCode: nodeid }).then(function (response) {
            $scope.childResponse = response.data;
            $scope.addCheckState($scope.childResponse);
            $scope.insertChildResponse(data, nodeid);           

        });
    };
    $scope.insertChildResponse = function (data, nodeid) {
        for (var i = 0; i < data.length; i++) {
            debugger;
            if (data[i].Code === nodeid) {
                data[i].children = $scope.childResponse;
                return
            }
            if (data[i].children !== undefined) {
                $scope.insertChildResponse(data[i].children, nodeid);
            }
        }
        $scope.nodes = data;
     }
     }
EzReportConfigController.$inject = ['$scope', '$element', '$attrs', '$http', 'runReportService', 'userEmailService', 'cronSchedulerService', 'ParentListService', 'localiser','ivhTreeviewOptions'];

树节点的HTML:

            <div class="treeview" ivh-treeview="nodes"
             ivh-treeview-expand-to-depth="0"
             ivh-treeview-id-attribute="'Code'" 
             ivh-treeview-label-attribute="'Name'"
             ivh-treeview-children-attribute="'children'"
             ivh-treeview-node-tpl="tpl"  ivh-treeview-selected-attribute="'selected'"
             ivh-treeview-twistie-tpl="leafExpanded">
        </div>

ivhTreeView Custome指令用于折叠的扭曲对象:

app.config(['ivhTreeviewOptionsProvider',
    function (ivhTreeviewOptionsProvider) {
        ivhTreeviewOptionsProvider.set({
            twistieExpandedTpl: '<span class="show-hide"><i class="fa fa-minus"></i></span>',
            twistieCollapsedTpl: '<leaf-expanded nodeid="nodeid" get-children-nodes="getChildrenNodes(node)"></leaf-expanded>'
        });
}])

    app.directive('leafExpanded', ['ivhTreeviewMgr', 'ivhTreeviewBfs', '$http', function (ivhTreeviewMgr, ivhTreeviewBfs, $http) {
    var linkFn = function (scope, element, attrs, ctrl) {
        debugger;
        element.bind('click', function () {
            scope.$apply(function () {
                debugger;
                getChildrenNodes({ node: scope.$parent.node.Code });
            });
        });
    };
    return {
        restrict: 'AE',
        require: '^ivhTreeview',
        scope: {
            getChildrenNodes: "&",
            node: "=",
            id: "=",
        },
        template: [
            '<span class="show-hide"><i class="fa fa-plus"></i></span>'].join('\n'),
        link: linkFn

    }
}]);

现在的问题是,单击getChildrenNodes()指令时未调用leaf-expanded函数。

0 个答案:

没有答案