javascript - 在 AngularJS 应用程序中加载 JSON(加载谷歌电子表格)

Question

我正在尝试在我的应用程序中加载 Google 电子表格，但我无法使其正常工作。我尝试了访问树结构的不同方法(通过 Controller 和/或通过 html)，但没有一种有效。知道可能出什么问题了吗？

这是我的 Controller :

app.controller('SuperCtrl', ['$scope', '$http', function($scope,$http) {
    $http.get("https://spreadsheets.google.com/feeds/list/1lZWwacSVxTD_ciOsuNsrzeMTNAl0Dj8SOrbaMqPKM7U/od6/public/values?alt=json-in-script&callback=x")
    .success(function(response) {
      $scope.items = response;
    });
}]);

这是 HTML:

<ul ng-controller="SuperCtrl">
  <li ng-repeat="item in items.feed.entry">
    {{ item.title.type }}
  </li>
</ul>

Answer 1

为你创建了一个工作 plunkr

http://plnkr.co/edit/JfXrVDWacvjF2RzxP18g?p=preview

但这也是解决方案的核心:

app.controller('SuperCtrl', ['$scope', '$http', function($scope,$http) {
    var url = 'https://spreadsheets.google.com/feeds/list/1lZWwacSVxTD_ciOsuNsrzeMTNAl0Dj8SOrbaMqPKM7U/od6/public/values?alt=json'
    var parse = function(entry) {
      var category = entry['gsx$category']['$t'];
      var description = entry['gsx$description']['$t'];
      var title = entry['gsx$title']['$t'];
      var url = entry['gsx$url']['$t'];
      var yo = entry['gsx$yo']['$t'];
      return {
        category: category,
        description: description,
        title: title,
        url: url,
        yo: yo
      };
    }
    $http.get(url)
    .success(function(response) {
      var entries = response['feed']['entry'];
      $scope.parsedEntries = [];
      for (key in entries) {
        var content = entries[key];
        $scope.parsedEntries.push(parse(content));
      }
    });
}]);

第一个问题是您使用的 API 的“脚本中的 json”版本很复杂，不是您想要的。将 API 结果更改为 JSON。

第二个问题是解析结果，请参阅我的函数，它将令人困惑的谷歌电子表格条目转换为易读的 JSON。

该示例有效 - 有一个修补匠。我的建议是找到 google 电子表格以外的东西来存储你的数据。

有趣的是，我实际上也在 google 电子表格之上构建了一个应用程序 (trackerkeeper.co)，这就是我可以帮助您的原因。对工程并不感到 super 自豪，但它很有趣:

祝你好运。