Я пытаюсь запустить функцию $ http, когда приложение AngularJS загружается первым.AngularJS - Запуск функции один раз при загрузке

Эта функция $ http должна завершиться до того, как любой из контроллеров моего приложения сможет нормально функционировать. Как мне это сделать? Это звучит как обещание, но это звучит, как я бы создать обещание в каждом контроллере ...

Я в настоящее время имеют функцию, которую я хочу, чтобы запустить первый, как это:

app.run(function() { 

    $http.get('link').success(function(data) { 

     // success function. The data that I get from this HTTP call will be saved to a service. 

    }).error(function(error) { 

    }); 

});

Однако иногда контроллер будет загружаться до завершения вызова http.

источник

2015-08-22 iO2

Каких данных этого запрос нагрузка? – dfsq

Загружает идентификационный номер, который используется для всех последующих запросов. Идентификатор сохраняется в службе. – iO2

не помечать ответ как принято так, чтобы другие новые люди не будут бороться –

Проблема

Угловая не является динамическим, вы не можете добавить контроллер динамически ни фабрики, и т.д. Кроме того, вы не можете отложить контроллер самозагрузки, угловую загружает все вместе, и это весьма невыгодное положение (будет исправлено в Угловое 2)

излечение

Но в JavaScript сам по себе имеет очень важную особенность - closure, которая работает в любом месте, в любое время.
И угловой имеет некоторые внутренние услуги, которые могут быть введены вне угловой экосистемы, даже в консоль браузера. Эти услуги вводятся, как показано ниже. Мы технически могли бы использовать что-нибудь еще (jQuery.ajax, window.fetch, или даже с XMLHttpRequest), но давайте придерживаться полного углового раствора

var $http_injected = angular.injector(["ng"]).get("$http");

Акт

Прежде всего, мы откладываем всю угловую приложение начальной загрузки, введите http-сервис. Затем вы делаете свой необходимый запрос, получаете данные, а затем закрываете get, чтобы работать, мы передаем полученные данные в какую-то службу, или мы также можем назначить некоторые угловые.constant или angular.value, но давайте просто сделаем демо с угловым сервисом, поэтому когда ваша служба имеет данные, самозагрузок всего приложения, так что все контроллеры инициализируются с необходимыми данными
в принципе такого рода задачи решаются, как этот

<body> 
    <div ng-controller="Controller1"> 
    <b>Controller1</b> 
    {{text}} 
    {{setting.data.name}} 
    </div> 
    <hr> 
    <div ng-controller="Controller2"> 
    <b>Controller2</b> 
    {{text}} 
    {{setting.data.name}} 
    </div> 
    <script> 
    //define preloader 
    var $http_injected = angular.injector(["ng"]).get("$http"); 
    $http_injected.get('http://jsonplaceholder.typicode.com/users/1').then(function(successResponse) { 

     //define app 
     angular.module('app', []); 

     //define test controllers 
     //note, usually we see 'controller1 loaded' text before 'settings applied', because controller initialized with this data, but in this demo, we will not see 'controller1 loaded' text, as we use closure to assign data, so it's instantly changed 
     angular.module('app').controller('Controller1', function($scope, AppSetting) { 
     $scope.text = 'controller1 loaded'; 
     $scope.setting = AppSetting.setting; 
     $scope.$watch('setting', function(e1 ,e2){ 
      $scope.text = 'settings applied' 
     }); 
     }); 
     angular.module('app').controller('Controller2', function($scope, AppSetting) { 
     $scope.text = 'controller2 loaded'; 
     $scope.setting = AppSetting.setting; 
     $scope.$watch('setting', function(e1 ,e2){ 
      $scope.text = 'settings applied' 
     }); 
     }); 

     //define test services, note we assign it here, it's possible 
     //because of javascript awesomeness (closure) 
     angular.module('app').service('AppSetting', function() { 
     this.setting = successResponse; 
     }); 

     //bootstrap app, we cannot use ng-app, as it loads app instantly 
     //but we bootstrap it manually when you settings come 
     angular.bootstrap(document.body, ['app']); 
    }); 
    </script> 
</body>

Plunker demo

источник

2015-08-22 17:56:17

Вы можете сделать это, когда вы настроить маршруты

app.config(['$routeProvider', function ($routeProvider) { 
    $routeProvider 
    .when('/', { 
     controller: 'MainCtrl', 
     templateUrl: 'main.html', 
     resolve: { 
     data: ['$http', 
      function($http) 
      { 
      return $http.get('/api/data').then(
       function success(response) { return response.data.rows[0]; }, 
       function error(reason)  { return false; } 
      ); 
      } 
     ] 
     } 
    }); 
}]);

Похожий вопрос: AngularJS - routeProvider resolve calling a service method

AngularJS: $routeProvider when resolve $http returns response obj instead of my obj

Херес plunkr я нашел с помощью службы, которая является то, что я бы не рекомендовал. http://plnkr.co/edit/XKGC1h?p=info

источник

2015-08-22 17:01:26

как этот вопрос может решить для всего штата ..? –

Это должно быть самое верхнее состояние –

Я не думаю, что он хочет, чтобы данные были загружены ..он хочет загрузить настройку конфигурации на этапе запуска –

AngularJS - Запуск функции один раз при загрузке

ответ

Проблема

излечение

Акт

Смежные вопросы