用Angular.js获取JSONP

<html ng-app="movieApp"> 
<head> 
<meta charset="utf-8"> 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css"> 
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.min.js"></script> 
<script> 
    var base = 'http://api.themoviedb.org/3'; 
    var service = '/movie/862'; 
    var apiKey = '####'; 
    var callback = 'JSON_CALLBACK'; 
    var url = base + service + '?api_key=' + apiKey + '&callback=' + callback; 
    var movieApp = angular.module('movieApp', []); 

    movieApp.controller('MovieCtrl', function ($scope, $http){ 
     $http.jsonp(url).then(function(data) { 
     $scope.movies = data; 
    }); 
    }); 
</script> 
</head> 
<body style="padding:12px;" ng-controller="MovieCtrl"> 
    <div ng-repeat="movie in movies"> 
    <h1>{{movie.title}} {{movie.id}}</h1> 
    <p>{{movie.overview}}</p> 
    <img ng-src="http://image.tmdb.org/t/p/w500{{movie.poster_path}}" style='width:200px'/> 
    </div> 
</body> 
</html>

尝试使用Angular.js获取JSON。这些信息很好，但我相信这种情况也正在出现。在屏幕上放置5个图像，4个破碎图像和1个良好图像以及数据。我怎样才能避免发送这些额外的数据？用Angular.js获取JSONP

来源

2015-11-13 Mick

可你应该我们您的服务器端？ '/ movie /'控制器只需要发送所需的信息，你也可以查看微服务。 – Pogrindis

微服务与什么有什么关系？ –

@DaveNewton没有什么特别的，但更容易定制响应数据。没什么特别的。只是想起来。根据我对这个问题的理解，OP不希望来自请求的所有信息，只是特定的信息：减少接收数据。 – Pogrindis

与AJAX

请求JSON数据，您希望通过AJAX请求来获取JSON数据并对其进行渲染。使用$ http服务实现控制器来获取数据并将其存储在范围中。

<body ng-app="MyApp"> 
    <div ng-controller="PostsCtrl"> 
    <ul ng-repeat="post in posts"> 
     <li>{{post.title}}</li> 
    </ul> 
    </div> 
</body> 
var app = angular.module("MyApp", []); 

app.controller("PostsCtrl", function($scope, $http) { 
    $http.get('data/posts.json'). 
    success(function(data, status, headers, config) { 
     $scope.posts = data; 
    }). 
    error(function(data, status, headers, config) { 
     // log error 
    }); 
});

http://fdietz.github.io/recipes-with-angular-js/consuming-external-services/requesting-json-data-with-ajax.html

来源

2015-11-13 17:34:33

这是如何减少收到的臃肿数据？ – Pogrindis

不要认为这是我的解决方案，$ http.get似乎不适用于这种情况。我试了几个例子，get和jsonp似乎只是解决方案，给了我任何成功。 – Mick

用Angular.js获取JSONP

回答

相关问题