如何从和服中提取API

时间:2014-11-25 21:01:33

标签: json angularjs jsonp

我们正在寻找从和服实验室提取API以及如何正确构建的最佳方法。 PLUNKER

以下是我们在app.js中的内容

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

App.controller('Calendar', function($scope, $http) {
  $http.get('http://www.kimonolabs.com/api/42ts6px8?apikey=363e7e1d3fffb45d424ad535ebdc233d&callback=kimonoCallback')
       .then(function(res){
          $scope.events = res.data[0].events;                
        });
});

...索引

<!doctype html>
<html ng-app="App" >
<head>
  <meta charset="utf-8">
  <title>Todos $http</title>
  <link rel="stylesheet" href="style.css">
  <script>document.write("<base href=\"" + document.location + "\" />");</script>
  <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.1/angular.js"></script>
  <script src="app.js"></script>

  <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
  <script>
      function kimonoCallback(data) {
        // do something with the data
        // please make sure the scope of this function is global
      }

      $.ajax({
        "url":"http://www.kimonolabs.com/api/42ts6px8?apikey=363e7e1d3fffb45d424ad535ebdc233d&callback=kimonoCallback",
        "crossDomain":true,
        "dataType":"jsonp"
    });
  </script>
</head>
<body ng-controller="Calendar">
  <ul>
    <li ng-repeat="item in events">
      <h1>{{item.EventTitles.text}}</h1>
      <img src="{{item.HeadlineImages.src}}">
      <p>{{item.eventdescription}}</p>
    </li>
  </ul>
</body>
</html>

我们这样做是否正确?我们可以让它从本地.json文件中提取数据......但不是来自和服?

任何帮助或正确方向的观点都将受到赞赏。谢谢你的时间。

编辑:我忘了提及,我知道我收录的和服实验室的API链接不起作用,这是故意的。

EDIT2 :如果可以帮助任何人,则添加PLUNKER

1 个答案:

答案 0 :(得分:0)

Kimono实际上有一个使用Angular.js调用API的教程。您可以通过以下文档查看:https://help.kimonolabs.com/hc/en-us/articles/204380310-Tutorial-Calling-Kimono-with-AngularJS-

根据我的经验,如果您通过电子邮件发送或聊天,他们也会得到非常可靠的支持。