AngularJS 玩弄手札 對 REST 用武器 - $resource

本故事純屬虛構，與一切真實人物、團體、故事無關。

摳頂人都知道 摳頂有許多原則

有時候人在摳頂身不由己 沒原則沒節操 又豈是少有之事

但是君子有所為有所不為 即便再沒原則沒節操 也不能忘記下面這個原則

KISS原則

師父常常跟我這麼說：

要把程式寫的複雜 很簡單 隨便TM怎麼寫 都很複雜 保證你的絕世武功絕不會被偷 包括未來的自己

但是要把程式寫的簡單 很困難 要怎樣寫 才能旁邊這些山頂洞人能一目了然 甚至讓未來的自己讚賞一下前人的偉大

Keep It Simple, Stupid

不怕神一般的需求 只怕豬一般的同事

這便是師父傳授我野球拳的最後一重

從此之後 我便把師父的諄諄教誨謹記在心 只要是 不夠 KISS 的 CODE 都是我的仇敵

而今天要被開刀的 就是這位在虎山被大蟲咬 然後結識又結識 Mr.Q 的朋友

Web API in Web Form 之 SPA 明知山有虎 偏向虎山行 上篇

AngularJS in Web Form 之 SPA 明知山有虎 偏向虎山行 下篇

AngularJS 玩弄手札 Mr.Q 非關 Jolin

這位朋友有什麼毛病呢？

他沒什麼毛病 程式能跑也能跳

但是 各位 不夠 KISS 呀

$q 先生這貨很神 果斷牛逼 山頂洞人們十分佩服 信奉其為神 天天三牲蔬果膜拜

那糟糕了 這群山頂洞人 完全不知道在衝三小 那豈不是我要 handle 所有 CRUD

那可不行 對付戰車有穿甲彈 對付這幫山頂洞人 我得找找 對 REST 用武器 好讓我奴役他們 handle 所有 CRUD

今日主角 燈燈燈 ~ 對 REST 用武器 - $resource

老歪文：Mapping an Angular Resource Service to a Web API

首先大斬 roleService.js 56 => 25 行

再來斬 rolesController 115 => 98 行

Web API 跟著改一些

飯粒檔

Web API in Web Form 之 SPA 明知山有虎 偏向虎山行 上篇

休息人人愛 REST也是

我亂講的 是不是人人愛我不知 至少是最近的顯學

而 ASP.NET Web API 則是微軟用他來證明自己也很潮 很RESTful

第一次參見 Web API 是在 MVC 4 上

他們相性很合直接使用無大礙

Web Form 則沒那麼好的待遇 誰叫微軟也是比較寵么子

同是自家 沒有不能用的道理 只是需要一些手段

就讓咱們來瞧瞧虎山之途

一隻老虎:是否2012

如果是 2012 的話 在加入新項目 可以直接選 Web APT 控制器類別

如果沒有 就直接建一般的類別 然後繼承 ApiController (需要將 System.Web.Http 加入參考)

類別名稱務必叫做 xxxController 預設命名多個 1 是陷阱

隨附範例代碼

設定 Routes

因為配合 MVC 所以它也是靠 Routes 來辨識 API 的路徑的

請在 Global.asax 設定以下東東 (需要將 System.Net.Http 跟 System.Web.Http.WebHost 加入參考)

需要 Json.NET

輸入 http://localhost:22354/api/Roles 如果能看到 JSON 的話代表我們通過第一階段

如果報錯 無法載入檔案或組件 'Newtonsoft.Json... 的話

沒有錯 我們需要Json.NET

定番 NuGet 一下搞定

接下來來看看怎麼玩 CRUD

首先需要一個 Role 類

再來當然是修改 RolesController 使他可以 CRUD 剛剛的 Role類

這裡先以 靜態的 List 來模仿 DB

接下來需要一個頁面 因為是 SPA 所以用一般 html 也沒所謂

寫些按鈕搭 JQuery 來測試 Get Post Put Delete

HTML:

JS:

截圖