用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>

angular.module('myApp', ['ngResource']);

入门：

>

期望将其恢复的后端，其端点结构为这样：> $resource

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

>

工作： $resource

>声明依赖性：向您的控制器或服务注入

。
1. >创建资源：使用其余端点URL来调用$resource。 这返回了资源类。
2. $resource()
>

使用默认方法：

angular.module('myApp.services').factory('Entry', function($resource) {
  return $resource('/api/entries/:id');
});

资源类提供：

3. ：检索单个资源。

   ：检索资源的集合。
   • > get()
   ：创建一个新的资源（post）。
   • > query()
   /
   • ：删除资源。save()>
   • remove() delete()
   >示例用法：
>

实例方法：

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 */ });
});

> non-get方法（

，
5. ，

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

   要执行更新（put），添加一个自定义
方法：>

angular.module('myApp', ['ngResource']);

7. 自定义配置：第四参数to 允许进一步的自定义，例如$resource()>。stripTrailingSlashes

构建电影应用程序（示例）：> >文章详细介绍了使用

构建完整的电影应用程序，包括控制器，视图和路由（使用

）。 后端API具有CORS启用，并且可在$resource上访问。 该示例涵盖了创建，阅读，更新和删除电影条目。ui-router> http://movieapp-sitepointdemos.rhcloud.com/api/movies

常见问题（常见问题解答）：

> >本文以一个全面的常见问题解答部分结束，该部分解决了有关使用

进行CRUD操作的常见问题，包括错误处理，自定义，测试以及与其他角模块的兼容性。 它还可以用非较高的API和不同版本的Angularjs阐明其用法。

以上是用Angular的$ Resource在几分钟内创建一个CRUD应用程序的详细内容。更多信息请关注PHP中文网其他相关文章！