發表文章

目前顯示的是 三月, 2014的文章

AngularJS + Google Spreadsheet

圖片
概要 這篇文章主要是說明如何寫 AngularJS 的 service,以類似 $resource REST 的方式來取得 Google 試算表的資料。
本文假設讀者已讀過 AngularJS Tutorial,了解 AngularJS 基本概念。 目錄建立試算表TemplateApp ModuleServiceController注意事項參考 建立試算表 前往 https://drive.google.com 或是參考已經建立好的試算表
先建立一份新的試算表:建立 > 試算表。

填寫資料表,以 AngularJS Tutorialphones.json 為例。

將試算表權限公開:檔案 > 共用 > 擁有存取權的使用者 > 變更。

共用設定 > 公開在網路上 > 存取權 > 可檢視 > 儲存。

權限公開後,發佈到網路:檔案 > 發佈到網路 > 內容有所變更時自動更新發佈 > 開始發佈。

發佈完成後,公開連結中會提供一組 key,可以前往 Google Data APIs 測試看看資料是否回傳正確。
接下來進入正式寫程式的階段,這裡我們會使用到 Tabletop.js 這個第三方的 library,提供 javascript 快速取得 json 格式的試算表資料。
這裡會以 AngularJS TutorialphonecatApp 為例子,說明如何實作 Tabletop.js 的 service。
Template 建立 index.html,並加入 angular.jsangular-route.jstabletop.js
index.html:
<!doctype html> <html ng-app="phonecatApp"> ... <div ng-view></div> ... <script src="angular.js"></script> <script src="angular-route.js"></script> <script src="tableto…

這個網誌中的熱門文章

DevOps:持續整合&持續交付(Docker、CircleCI、AWS)

Factory pattern 工廠模式

Mock Server&契約測試