Question

我有一个块，我想在刷新按钮点击时更新。

<div ng-controller="Ctrl1">
    <ct-paneltool tool-refresh="load1">
        <a href="#" class="btn btn-transparent btn-sm" panel-refresh="" tooltip-placement="top" tooltip="Refresh" data-spinner="load1" ng-click="getData()"><i class="ti-reload"></i></a>
    </ct-paneltool>
    {{ Data }}
</div>

在我的控制器中，我有功能

$scope.getData = function(callback){

    $http.get(
      'url',
      {}
    ).then(function (response) {

        $scope.Data = response;
        console.log(callback); // Here returns function anonymous()
        callback();


    });

}

在我的指令中，我有代码

.directive('panelRefresh', function () {
    'use strict';

    return {
        restrict: 'A',
        controller: ["$scope", "$element", function ($scope, $element) {

            var refreshEvent = 'panel-refresh', csspinnerClass = 'csspinner', defaultSpinner = 'load1';

            function removeSpinner() {
                this.removeClass(csspinnerClass);
            }

            $element.on('click', function () {


                var $this = $(this), panel = $this.parents('.panel').eq(0), spinner = $this.data('spinner') || defaultSpinner;
                panel.addClass(csspinnerClass + ' ' + spinner);

                $scope.getData( function(){
                    // attach as public method
                    panel.removeSpinner = removeSpinner;

                    // Trigger the event and send the panel object
                    $this.trigger(refreshEvent, [panel]);
                } );





            });

        }]
    };
});

当我单击刷新按钮时，会出现spinner，getData（）会加载数据，但回调不会触发。记录回调显示＆＃39;功能匿名（）＆＃39;

请告诉我，我做错了什么？这是我第一次使用Angular。如果我想以另一种方式设置我的代码，请解释我。

另外，我想在加载时调用panelRefresh指令。有可能吗？

Answer 1

这是你的解决方案

(function ($, window, document) {
    'use strict';

    $(document).on('panel-refresh', '.panel', function (e, panel) {

        // perform any action when a .panel triggers a the refresh event
        setTimeout(function () {
            // when the action is done, just remove the spinner class
            panel.removeSpinner();
        }, 3000);

    });

}(jQuery, window, document));

AngularJS从带有回调的指令调用控制器

1 个答案: