javascript - 在 $http.get 从 angularjs 中的 RESTful API 获取数据时放置一个微调器

Question

我正在我的 Controller 中使用这个函数获取数据:

var fetchStoreItems = function () {
    return $http.get('/enterprises/_store').then(function (response) {
        $scope.items = response.data;
    }, function (errResponse) {
        console.error("Error while fetching data")
    })
};

它运行良好且速度足够快。但是，如果有很多元素要取怎么办？!我想在获取数据时放置一个微调器。

我该怎么做？

Answer 1

在你的 Controller 中，

var fetchStoreItems = function () {
    $scope.loading = true;            //define a `$scope` variable; show loading image when ajax starts
    return $http.get('/enterprises/_store').then(function (response) {
        $scope.items = response.data;
        $scope.loading = false;       //hide loading image  when ajax successfully completes
    }, function (errResponse) {
        console.error("Error while fetching data");
        $scope.loading = false;      //hide loading image  when ajax error
    })
};

<img src="pathToLoadingImage" ng-show="loading" />  // show the loading image according to `$scope.loading`