如何使用angularjs中的$ resource来使用spring restful web服务

时间:2015-06-30 05:54:34

标签: java angularjs spring hibernate rest

我正在使用angularjs开发一个spring restful应用程序。在Spring中我正在使用maven和Hibernate。

我使用弹簧休息返回了json对象,但我不知道如何在我的角度控制器中使用$ resource

这是我的弹簧控制器

@RequestMapping(value = "/list", method = RequestMethod.GET)
public @ResponseBody
List<Employee> getEmployee() {
List<Employee> employeeList = null;
    try {
employeeList = dataServices.getEntityList();

    } catch (Exception e) {
        e.printStackTrace();
    }

    return employeeList;
}

这是我的jsp

<body>
<h3>FirstName:</h3>

<!-- First name from json object -->
<p></p>

<h3>LastName:</h3>

<!-- Last name from json object -->
<p></p>
</body>

所以请帮我使用angularjs控制器代码

我的应用程序名称是:SpringRestCrud1

用于返回json对象的路径是:http://localhost:8080/SpringRestCrud1/employee/list

我的结果是:[{&#34; id&#34;:3,&#34; firstName&#34;:&#34; Hoston&#34;,&#34; lastName&#34;:&# 34; lindey&#34;&#34;电子邮件&#34;:&#34; hl@gmail.com",&#34;电话&#34;:&#34; 90908989899&#34;}]

1 个答案:

答案 0 :(得分:1)

ngResource is very simple to use. How I typically use it is I first create a factory that is used to map to the CRUD endpoint:

angular.module('angularRestCrud1')
  .factory('Employee', function ($resource) {
    return $resource('http://localhost:8080/SpringRestCrud1/employee/list', {}, {
      'query': {
        method: 'GET',
        params: { action: 'read', format: '.json' } , isArray : false
      }
    });
  });

From there you can set up a controller to access the list:

angular.module('angularRestCrud1')
  .controller('EmployeeCtrl', function ($scope, Employee) {

    // Promise chain to resolve employee
    Employee.query(function (data) {
      $scope.employees = data;
    });

    });

And a view to show the employee list:

<body>
    <div ng-repeat="employee in employees track by $index">
        <h3>FirstName:</h3>
        <!-- First name from json object -->
        <p>{{ employee.firstName }}</p>

        <h3>LastName:</h3>
        <!-- Last name from json object -->
        <p>{{ employee.lastName }}</p>
    </div>  
</body>

I would suggest though that you redesign your endpoints to be more RESTful if you are going to use ngResource. Here's a good guide for that.