用Angular的$ Resource在幾分鐘內創建一個CRUD應用程序

>本文演示瞭如何使用$resource服務在AngularJS應用程序中有效地執行CRUD（創建，讀取，更新，刪除）操作。 它簡化了與靜止後端的互動。

密鑰概念：

• >利用$resource：$resource>通過提供與RESTFUL API交互的方便接口來簡化CRUD操作。
• 設置和配置：需要包括>並聲明對angular-resource.js>模塊的依賴。 ngResource
• 方法：$resource使用五個默認方法（，get()，query()，save()，remove()，delete()，
）與RESTFULE端點進行交互。
• > $resource擴展：
>允許通過添加自定義方法或修改諸如URL參數和數據轉換之類的配置來自定義。 >
• >實踐示例：>逐步指南構建電影應用程序，在現實世界中展示CRUD功能。

>先決條件：

>

> file（從cdnjs等CDN中獲得）必須包含在您的html中，並且您的angularjs模塊需要聲明對angular-resource.js>的依賴性：ngResource>

<code class="language-javascript">angular.module('myApp', ['ngResource']);</code>

入門：

>

期望將其恢復的後端，其端點結構為這樣：> $resource

示例使用node.js，express和mongodb進行後端，但是任何靜止的API都可以使用。

>

工作： $resource

>聲明依賴性：向您的控制器或服務注入

。
1. >創建資源：使用其餘端點URL來調用$resource。 這返回了資源類。
2. $resource()
>

使用默認方法：

<code class="language-javascript">angular.module('myApp.services').factory('Entry', function($resource) {
  return $resource('/api/entries/:id');
});</code>

資源類提供：

3. ：檢索單個資源。

   ：檢索資源的集合。
   • > get()
   ：創建一個新的資源（post）。
   • > query()
   /
   • ：刪除資源。 save()>
   • remove() delete()
   >示例用法：
>

實例方法：

<code class="language-javascript">angular.module('myApp.controllers').controller('ResourceController', function($scope, Entry) {
  Entry.get({id: $scope.id}, function(entry) { console.log(entry); });
  Entry.query(function(entries) { console.log(entries); });
  $scope.entry = new Entry();
  $scope.entry.data = 'some data';
  $scope.entry.$save(function() { /* data saved */ });
});</code>

> non-get方法（

，
5. ，

   ），可以在使用>的實例上獲得。 。 $save() $delete() $remove()>new Entry()更新操作：

   要執行更新（put），添加一個自定義
方法：>

<code class="language-javascript">angular.module('myApp', ['ngResource']);</code>

7. 自定義配置：第四參數to 允許進一步的自定義，例如$resource()>。 stripTrailingSlashes

構建電影應用程序（示例）：> >文章詳細介紹了使用

構建完整的電影應用程序，包括控制器，視圖和路由（使用

）。 後端API具有CORS啟用，並且可在$resource上訪問。 該示例涵蓋了創建，閱讀，更新和刪除電影條目。 ui-router> http://movieapp-sitepointdemos.rhcloud.com/api/movies

常見問題（常見問題解答）：

> >本文以一個全面的常見問題解答部分結束，該部分解決了有關使用

進行CRUD操作的常見問題，包括錯誤處理，自定義，測試以及與其他角模塊的兼容性。 它還可以用非較高的API和不同版本的Angularjs闡明其用法。

以上是用Angular的$ Resource在幾分鐘內創建一個CRUD應用程序的詳細內容。更多資訊請關注PHP中文網其他相關文章！