在AngularJS App中加载JSON(加载谷歌电子表格)

Ima*_*lea 4 javascript json google-sheets 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;
    });
}]);
Run Code Online (Sandbox Code Playgroud)

这是HTML:

<ul ng-controller="SuperCtrl">
  <li ng-repeat="item in items.feed.entry">
    {{ item.title.type }}
  </li>
</ul>
Run Code Online (Sandbox Code Playgroud)

Pet*_*ell 6

为你创造了一个工作的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));
      }
    });
}]);
Run Code Online (Sandbox Code Playgroud)

您使用API​​的'json in script'版本的第一个问题是复杂而不是您想要的.将API结果更改为JSON.

第二个问题是解析结果,请参阅我的功能,将令人困惑的谷歌电子表格条目转换为可读的JSON.

这个例子有效 - 有修补.我的建议是找到谷歌电子表格以外的东西来存储你的数据.

这很有趣,我实际上也在谷歌电子表格上建立了一个应用程序(trackerkeeper.co),这就是我可以帮助你的原因.不是超级工程的骄傲,但它很有趣:

祝好运.

  • 那个plunkr似乎不再起作用了.很想看到它再次运作:) (3认同)