将 jsonp 加载到多个 AngularJS 控制器中答案

【问题标题】：load jsonp into multiple AngularJS controllers将 jsonp 加载到多个 AngularJS 控制器中
【发布时间】：2014-09-16 12:54:26
【问题描述】：

我有一个对服务器的 jsonp 调用，它返回一个包含两个对象的对象。

目前我使用 jQuery 进行 jsonp 调用，因为我刚刚开始学习 AngularJS，但我不知道它是如何完成的。

我想在navController 中使用data.filters，在contentController 中使用data.results

使用 AngularJS 实现这一目标的正确方法是什么？

(function($, angular) {
    $(function() {
        $.ajax({
            jsonp: "JSONPCallback",
            url: 'myUrl',
            dataType: 'jsonp',
            success: function(data) {
               //data =  {"filters":{...},"results":{...}}
            }
        });
     });

     var app = angular.module('app', []);
     var controllers = {};

     controllers.navController = function($scope) {
          $scope.filters = [{}];
     };

      controllers.contentController = function($scope) {
          $scope.results = [{}];
     };

     app.controller(controllers);

})(jQuery, angular);

【问题讨论】：

标签： angularjs jsonp

【解决方案1】：

您好，请看这里http://plnkr.co/edit/hYkkQ6WctjhYs8w7I8sT?p=preview

var app = angular.module('plunker', []);


app.service('dataService', function($http){

  var url = "http://public-api.wordpress.com/rest/v1/sites/wtmpeachtest.wordpress.com/posts?callback=JSON_CALLBACK";

  var dataReady= false
  var filters = [];
  var results = [];

  function getData() {

    if (dataReady)
    retrun
    else
    {

      $http.jsonp(url)
    .success(function(data){

        //in your case 
        //angular.copy(data.filters, filters)
        //angular.copy(data.results , results )
        angular.copy(data.posts[0], results);
        angular.copy(data.posts[1], filters);
        dataReady = true
    }).error(function(){

      alert('cant load data');

    });

    }


  }


  return {
    filters : filters,
    results : results,
    getData : getData
  }

})
app.controller('MainCtrl', function($scope,dataService) {
  $scope.name = 'World';

  $scope.items = dataService.results;

  dataService.getData();

});

app.controller('SecondCtrl', function($scope,dataService) {


  $scope.filters = dataService.filters;

  dataService.getData();

});

【讨论】：