【问题标题】:Angular. How to chenge json response to jsonp response?角。如何将 json 响应转换为 jsonp 响应?
【发布时间】:2015-08-29 18:08:44
【问题描述】:

我使用 openweathermap api 获取 json 数据,但我需要获取并使用 jsonp 数据,如何在我的角度服务中执行此操作?

app.factory('forecast', ['$http', function($http) { 
  this.sendAPIRequest = function(city){
      return $http.get('http://api.openweathermap.org/data/2.5/forecast/city?q='+city+'&units=metric&mo') 
      .success(function(data) { 
          return data; 
      }) 
      .error(function(err) { 
          return err; 
      }); 
  },

【问题讨论】:

    标签: javascript jquery json angularjs jsonp


    【解决方案1】:

    https://docs.angularjs.org/api/ng/service/$http#jsonp 演示使用 Angular 接收 JSONP 对象的正确方法。

    $http 服务调用(来自 AngularDocs)如下所示:

    $http({method: 'JSONP', url: $scope.url, cache: $templateCache})
        .success(function(data, status) {
            $scope.status = status;
            $scope.data = data;
        })...
    

    虽然标记绑定此功能是:

    <div ng-controller="FetchController">
      <select ng-model="method" aria-label="Request method">
        <option>GET</option>
        <option>JSONP</option>
      </select>
      <input type="text" ng-model="url" size="80" aria-label="URL" />
      <button id="fetchbtn" ng-click="fetch()">fetch</button><br>
      <button id="samplegetbtn" ng-click="updateModel('GET', 'http-hello.html')">Sample GET</button>
      <button id="samplejsonpbtn"
        ng-click="updateModel('JSONP',
                      'https://angularjs.org/greet.php?callback=JSON_CALLBACK&name=Super%20Hero')">
        Sample JSONP
      </button>
      <button id="invalidjsonpbtn"
        ng-click="updateModel('JSONP', 'https://angularjs.org/doesntexist&callback=JSON_CALLBACK')">
          Invalid JSONP
        </button>
      <pre>http status code: {{status}}</pre>
      <pre>http response data: {{data}}</pre>
    </div>
    

    所以基本上你的最终结果是:

    app.factory('forecast', ['$http', function($http) { 
      this.sendAPIRequest = function(city){
           return $http.jsonp('http://api.openweathermap.org/data/2.5/forecast/city?q='+city+'&units=metric&mo') 
           .success(function(data) { 
               return data; 
           }) 
           .error(function(err) { 
               return err; 
           }); 
       },
    

    如此处所示:parsing JSONP $http.jsonp() response in angular.js

    【讨论】:

    • 你太棒了它的工作原理,现在我可以用工作移动一个:)
    猜你喜欢
    • 1970-01-01
    • 2018-07-29
    • 2023-02-08
    • 2016-07-30
    • 2021-09-04
    • 2019-09-26
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多