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

Load JSON in AngularJS App (loading google spreadsheet)

本文关键字:加载 谷歌 电子表格 JSON 应用程序 AngularJS      更新时间:2023-09-26

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

这是我的控制器:

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>
为你

创建了一个工作 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。

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

有趣的是,我实际上也在谷歌电子表格之上构建了一个应用程序(trackerkeeper.co),这就是为什么我可以帮助你。对工程不是很自豪,但很有趣:

祝你好运。

这是一个新的工作 plunker。问题是它再也找不到"yo"变量了。

var parse = function(entry) {
  console.log(entry);
  var category = entry['gsx$category']['$t'];
  var description = entry['gsx$description']['$t'];
  var title = entry['gsx$title']['$t'];
  return {
    category: category,
    description: description,
    title: title,
    url: url
  };
}

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