Запустите API перед загрузкой страницы Angularjs

#angularjs

#angularjs

Вопрос:

Я использую API в main.js , выходные данные API будут использоваться на нескольких страницах и контроллерах, использующих rootscope. Итак, мне нужно убедиться, что API запускается до загрузки любой страницы. В настоящее время сначала загружается страница, а затем запускается API. Следовательно, я не могу привязать вывод API к html div.

Пожалуйста, помогите!

Комментарии:

1. Вы должны использовать resolve в своих маршрутах. Но поскольку вы не предоставили никакого кода или чего-либо еще, никто не сможет вам помочь. Пожалуйста, обновите свой вопрос соответствующим кодом.

2. Я не уверен, что понимаю …. если вы присваиваете результат API $rootScope объекту, все страницы / контроллеры, использующие этот объект, автоматически обновляются. Возможно, вы могли бы добавить какой-нибудь пример кода, то, что вы получаете, и то, что вы хотели бы видеть.

Ответ №1:

Вы можете использовать либо службу angular для вызова api и внедрения в контроллер, либо использовать provider в конфигурации и назначить данные $rootScope

Ответ №2:

Сделайте что-то вроде этого.

 app.run(function($http, $rootScope){
  $http.get('CALL_TO_YOUR_API')
  .success(function(data, status, headers, config) {
    $rootScope.config = data;
    $rootScope.$broadcast('API-loaded');
  })
  .error(function(data, status, headers, config) {
    // log error
    alert('error');
  });
})

app.controller('MainControl', function($scope, $rootScope) {
  $scope.$on('API-loaded', function(){
//DO your stuff  
  });
});
 

Ответ №3:

Вам нужно использовать resolve в config.js

 .state('sampleState', {
                 url: "/sample",
                 templateUrl: "sample.html",
                 controller: 'SampleCtrl',
                 resolve: {
                     companyDetails : function($http) {
                         return $http.get('api/v1/get_sample')
                             .then(function (data) {
                              return data
                             }, function (data) {
                             });
                     }
                 }
             })