Question

Cinemalytics API端点，提供JSON输出： http://api.cinemalytics.com/v1/movie/releasedthisweek?auth_token=[token]&callback=JSON_CALLBACK

如何访问＆＃34;标题＆＃34;从这个JSON对象，使用AngularJS

[
    {
        "Id": "b2a1844b",
        "ImdbId": "tt0315642",
        "OriginalTitle": "Wazir",
        "Title": "Wazir",
        "Description": "'Wazir' is a tale of two unlikely friends, a wheelchair-bound chess grandmaster and a brave ATS officer. Brought together by grief and a strange twist of fate, the two men decide to help each other win the biggest games of their lives. But there's a mysterious, dangerous opponent lurking in the shadows, who is all set to checkmate them.",
        "TrailerLink": "https://www.youtube.com/watch?v=gdwM7xKOph0",
        "TrailerEmbedCode": "<iframe width=\"850\" height=\"450\" src=\"https://www.youtube.com/embed/gdwM7xKOph0\" frameborder=\"0\" allowfullscreen></iframe>",
        "Country": "IN",
        "Region": "BOLLYWOOD",
        "Genre": "Drama",
        "RatingCount": 16,
        "Rating": 3.7,
        "CensorRating": "U/A",
        "ReleaseDate": "1/8/2016",
        "Runtime": 102,
        "Budget": 0,
        "Revenue": 0,
        "PosterPath": "https://s3-ap-southeast-1.amazonaws.com/cinemalytics/movie/F6E428DA299F2ECEED5B4D3B1723A202.jpg"
    },
    {
        "Id": "1e3424cb",
        "ImdbId": "tt3777164",
        "OriginalTitle": "Chauranga",
        "Title": "Chauranga",
        "Description": "A fourteen-year-old Dalit boy (Soham Maitra) is growing up in an unnamed corner of India. His dream is to go to a town school like his elder brother (Riddhi Sen) and his reality is to look after the pig that his family owns. His only escape is to sit atop a Jamun tree and adore his beloved (Ena Saha) passing by on her scooter. His unspoken love is as true as his mother’s helplessness who cleans the cowsheds of the local strongman’s mansion, with whom she also has a secret liaison. When the boy’s elder brother comes on a vacation to the village, he soon finds out about his younger brother’s infatuation. The learned elder brother makes him realize the need to express his love and helps him write a love letter.",
        "TrailerLink": "https://www.youtube.com/watch?v=Nu50meFTNU4",
        "TrailerEmbedCode": "<iframe width=\"850\" height=\"450\" src=\"https://www.youtube.com/embed/Nu50meFTNU4\" frameborder=\"0\" allowfullscreen></iframe>",
        "Country": "IN",
        "Region": "BOLLYWOOD",
        "Genre": "Drama",
        "RatingCount": 17,
        "Rating": 3.84706,
        "CensorRating": "U/A",
        "ReleaseDate": "1/8/2016",
        "Runtime": 90,
        "Budget": 0,
        "Revenue": 0,
        "PosterPath": "https://s3-ap-southeast-1.amazonaws.com/cinemalytics/movie/083FFED0BC933C2D60E8891B89269EB3.jpg"
    }
]

Answer 1

如果JSON位于变量movies中：

 movies.map(function (m) {return m.Title;});

见JSbin example。

查询端点：

$http.get('http://api.cinemalytics.com/v1/movie/releasedthisweek?auth_token=59CD0710AD10858DD65FE815F0181603&callback=JSON_CALLBACK')
    .then(function(res) {
          $scope.titles = res.map(function (m) {return m.Title;});
    });

$scope.titles会保留提取的标题。

Answer 2

使用您当前的网址

http://api.cinemalytics.com/v1/movie/releasedthisweek?auth_token=<auth_token>&callback=JSON_CALLBACK

你可能有跨领域问题。但是，您可以使用（https://crossorigin.me/）服务来避免此问题。

然后，你应该要求：

https://crossorigin.me/http://api.cinemalytics.com/v1/movie/releasedthisweek?auth_token=<auth_token>&callback=JSON_CALLBACK

最后，这可以在AngularJS代码中轻松使用。

我使用AngularJS服务和控制器进行了演示。

＆＃13;

(function() {
  var app = angular.module("myApp", []);

  // Service
  app.service("Service", ["$http",
    function($http) {
      return {
        getData: function() {
          return $http.get("https://crossorigin.me/http://api.cinemalytics.com/v1/movie/releasedthisweek?auth_token=<auth_token>&callback=JSON_CALLBACK", null, {
            responseType: "json"
          });
        }
      };
    }
  ]);

  // Controller
  app.controller("Controller", ["$scope", "Service",
    function($scope, Service) {
      $scope.data = [];

      $scope.list = function() {
        // Calling the getData() function from the Service.
        Service.getData().then(function(response) {
          $scope.data = response.data; // Store the response in the data variable.
        }, function(response) {
          console.log(response); // if there is an error...
        });
      };
      $scope.list(); // Call to the function once.
    }
  ]);
})();

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div data-ng-app="myApp">
  <div data-ng-controller="Controller">
    <ul>
      <!-- As you have an array, you should use data-ng-repeat to show the items collection. -->
      <!-- Use data-ng-bind to show the Title (One-way data binding). -->
      <li data-ng-repeat="item in data" data-ng-bind="item.Title">
      </li>
    </ul>
  </div>
</div>

＆＃13;

希望这有帮助。

Answer 3

由于没有显示其他上下文或代码尝试，以下是简单的Angular GET请求。

angular.module('myApp', [])
.controller('myController', function($http) {
var vm = this;
getObject();

function getObject() {
    return $http.get('http://api.cinemalytics.com/v1/movie/releasedthisweek?auth_token=59CD0710AD10858DD65FE815F0181603&callback=JSON_CALLBACK')
                .then(function(res) {
                      vm.object = res.data;
                });
});


<div ng-app="myApp">
   <div ng-controller="myController as vm" ng-repeat="item in vm.object track by item.Id">
      Item {{item.Id}} - Title: {{item.Title}}
   </div>
</div>

如何访问＆＃34;标题＆＃34;从这个JSON对象，使用AngularJS

3 个答案: