Question

目前正在使用angularjs。现在我有一个ng-click功能，当选中或取消选中复选框时会调用它。我有一个完整的页面加载器，当我点击复选框时，它将显示。只有在加载完整视图后才会隐藏它。我尝试了这段代码而且无法正常工作

点击

<input type="checkbox"id="myId" ng-click="sampleClick(1)">

这里是js代码

$scope.sampleClick = function(type) {

        var param       = new Object();
        param.type      = type;

        //side bar listing
        Data.post('url/testurl', param).then(function(data){
            $scope.all          = '';
            $scope.all          = angular.fromJson(data);

            console.log("Contents is trying to load.");
            $scope.$on('$viewContentLoaded',function(event, viewConfig){
                console.log("Contents did load.");
                $rootScope.setVariable = 1;
            });

        }, function (error) {
            $rootScope.setVariable = 1;         
        });

    }

我只想在视图部分完全加载时设置$ rootScope.setVariable = 1.（每次单击复选框时）

注意：当我在页面加载时使用$ viewContentLoaded时，它没有任何问题。但是当我使用相同的ng-click功能时，我没有得到任何回复。

Answer 1

如果使用ng-repeat渲染视图，为什么不能使用ng-repeat指令来处理渲染的结束，然后启动函数调用。

例如

<div ng-repeat="i in things" repeat-done>
// here you use i to render your filter with checkbox
</div>

和指令看起来像

app.directive('repeatDone', function($rootScope) {
  return function(scope, element, attrs) {
    if (scope.$last){
        //set your variables or do you job
    }
  };
})

Answer 2

You can set one flag you can set it value true/false.

for example(I am taking your example so you can understand it batter):- 

$scope.loading = false;
$scope.sampleClick = function(type) {

        var param       = new Object();
        param.type      = type;

        //side bar listing
        Data.post('url/testurl', param).then(function(data){
            $scope.all          = '';
            $scope.all          = angular.fromJson(data);

            console.log("Contents is trying to load.");
              $scope.loading = true;
            $scope.$on('$viewContentLoaded',function(event, viewConfig){
              $scope.loading = false;
                console.log("Contents did load.");
                $rootScope.setVariable = 1;
            });

        }, function (error) {
            $rootScope.setVariable = 1;         
        });

    }

这里我有$ scope.loading变量，其默认值为false，当你单击复选框然后它将被设置为true所以那时你可以显示加载器，当它获取数据时它将被设置为是的，所以它会停止加载。

我希望你明白。

仅在页面视图中完成数据加载后隐藏页面加载器

2 个答案: