【API设计风格—RESTful】：前端如何调用RESTful风格的API（三）

最新推荐文章于 2024-10-13 17:13:37 发布

xu_chenyang

最新推荐文章于 2024-10-13 17:13:37 发布

阅读量1.6w

点赞数 2

分类专栏： ▶【其他】 ……【API设计风格】文章标签： api api设计 RESTful

本文链接：https://blog.csdn.net/u010924834/article/details/50965062

版权

本文介绍了在AngularJS应用中如何利用$resource服务调用RESTful风格的API。首先，通过在index.xml中引入服务文件和angularjs-resource.js。接着，在services.js中定义服务，并在app.js中注册。在controller.js中调用服务中的方法，如update和save，与后端进行数据交互。页面展示返回的JSON数据。此外，文章还提供了$resource方法的说明，包括GET和非GET动作的使用方式。

摘要由CSDN通过智能技术生成

　　前端使用的是Ionic+AngularJS的架构，下面我们看看如何用AngularJS+$Resource定义Restful客户端。

【1】如何写

模板

定制的服务被定义在app/js/services，所以我们需要在布局模板中引入这个文件。另外，我们也要加载angularjs-resource.js这个文件，它包含了ngResource模块以及其中的$resource服务，我们一会就会用到它们。
在index.xml中引入js文件

 <script src="js/services.js"></script>
  <!--使用Restful必须引入的脚本  -->
  <script src="lib/ionic/js/angular/angular-resource.js"></script>

服务

在js/services.js文件中写如下代码

angular.module('itoo-basic-curriculumschedule.services', ['ngResource'])
//定义了一个课程的服务工厂
.factory('lessonService', function($resource,baseUrl){
                
        return $resource(baseUrl+'/student/:studentId/course/:courseId', {},
            {
                 get: {method:'GET',isArray:false},
                 query: {method:'GET',isArray:true},
                 save: {method:'POST',isArray:false},
                 update: {method:'PUT',isArray:false},
                 del:{method:'DELETE',isArray:false}
            }
        );

 })