Погрузчик не отображается по запросу ajax в угловых js

Поскольку я использую запрос ajax, используя $ http. Это займет много времени, так как моя операция на сервере требует времени. Мне нужно <body ng-app = "app"> <! - loader, можно использовать на нескольких страницах -> <div class = "load loader-quart" ng-show = "isLoading"> </ div> <! - my logic -> </ body> загрузчик во время обработки запроса, но загрузчик не отображается. Хотя мой код кажется правильным. Я пробовал разные методы, но не работал.

Index.html

//method to get all the attributes and send to server using service
    $scope.add = function () {
        if ($scope.Option == 'newInstance')
            $scope.singleObject.FK_Name = 'MetisEmptyTemplate';
        $rootScope.isLoading = true;
        var featuresList = websiteService.getUpdatedTree($scope.treeDataSource);
        var formData = new Website("", $scope.singleObject.Name, $scope.singleObject.DisplayName, $scope.singleObject.Description, $scope.singleObject.State, "", $scope.singleObject.FK_Name, $scope.singleObject.Email, featuresList);

        websiteService.addwebsite(formData);
        $rootScope.isLoading = false;
    }

addCtrl.js

//service to add website
    this.addwebsite = function (website) {
        $http({
            method: 'POST',
            url: $rootScope.url + 'Add',
            data: JSON.stringify(website),
            contentType: 'application/json'
        }).success(function (data) {
            alert(data);
        }).error(function (data, status, headers, config) {
            //alert(data);
        });
    }

websiteService.js

.then()

Поскольку я собираюсь включить isLoading как «true» в начале, а затем после завершения запроса, я поворачиваю isLoading «false». Где проблема в коде?

javascript,angularjs,ajax,

0

Ответов: 3

1 принят

Ваш веб-сайт код сервиса выполняется асинхронно. Это означает, что в приведенном выше коде будет отображаться загрузчик, а затем довольно много. This.addwebsite = function (website) {var deferred = $ q.defer (); $ http ({method: 'POST', url: $ rootScope.url + 'Добавить', данные: JSON.stringify (веб-сайт), contentType: 'application / json'}). success (function (data) {alert (data ) (отложено (данные, статус, заголовки, config) {// alert (данные); deferred.reject (data);}). return deferred.promise} снова.

Чтобы обрабатывать асинхронный код в контроллере, вы должны вернуть обещание от службы и поместить скрытие счетчика в функцию обратного вызова с помощью websiteService.addwebsite(formData).then(function(){ $rootScope.isLoading = false }); .

оказание услуг:

    this.insertMliveResponse = function(data){
        var defer=$q.defer();
        var requestURL='/mlive-portlet/rest/mliveResponseService/insertmLiveResponse';
        httpRequest(requestURL,data).then(function(data){
                defer.resolve(data.data);
        },function(data){
            defer.reject(data.data);
        })
        return defer.promise;
    }

контроллер:

show
0 
hide
0

Если вы делаете запрос, я думаю, что лучший способ show hideзагрузкиinterceptor

В моем фрагменте я использую загрузчик для активации / дезактивации загрузчика

Например:

// http.config.js  file
export function httpConfig($httpProvider, AuthInterceptProvider) {
  'ngInject';
  AuthInterceptProvider.interceptAuth(true);

  // added for show loader
  $httpProvider.interceptors.push(function (loaderService, $q) {
    'ngInject';
    return {
      'request': function (config) {
        loaderService.switchLoaderModeOn();
        return config;
      },

      'requestError': function (rejection) {
        loaderService.switchLoaderModeOff();
        return $q.reject(rejection);
      },

      'response': function (response) {
        loaderService.switchLoaderModeOff();
        return response;
      },

      'responseError': function (rejection) {
        loaderService.switchLoaderModeOff();
        return $q.reject(rejection);
      }
    };
  });
}

// and in your module.js file
import {httpConfig} from './config/http.config';

.config(httpConfig)
JavaScript, angularjs, AJAX,
Похожие вопросы
Яндекс.Метрика