在AngularJS应用中加载JSON（加载Google电子表格）

小编典典

在AngularJS应用中加载JSON（加载Google电子表格）

angularjs

我正在尝试在我的应用程序中加载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>

阅读 248

2020-07-04

共1个答案

小编典典

为您创建了一个工作的朋克

http://plnkr.co/edit/JfXrVDWacvjF2RzxP18g?p=预览

但是，这也是解决方案的重点：

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。

第二个问题是解析结果，请参阅我的函数，该函数将令人困惑的Google电子表格条目转换为可读性强的JSON。

该示例作品-修补匠。我的建议是找到Google电子表格以外的其他东西来存储您的数据。

很好笑，我实际上也在google电子表格（trackerkeeper.co）上构建了一个应用程序，这就是为什么我可以为您提供帮助。虽然对工程学并不感到骄傲，但是这很有趣：

祝好运。

2020-07-04