How to connect Angular JS with spring mvc using $http service to get data from controller to jsp

Question

    My Controller:

How to get values from spring MVC to Angular js to display in jsp page. Below i posted my spring MVC and Angular js config code.Please some one help how to grt values from Spring controller.how to get url path of our controller.

    package com.dineshonjava.controller;

    import java.util.ArrayList;
    import java.util.HashMap;
    import java.util.List;
    import java.util.Map;






    import org.hibernate.SessionFactory;
    import org.springframework.beans.factory.annotation.Autowired;
    import org.springframework.stereotype.Controller;
    import org.springframework.validation.BindingResult;
    import org.springframework.web.bind.annotation.ModelAttribute;
    import org.springframework.web.bind.annotation.RequestMapping;
    import org.springframework.web.bind.annotation.RequestMethod;
    import org.springframework.web.servlet.ModelAndView;

    import com.dineshonjava.bean.EmployeeBean;
    import com.dineshonjava.model.Employee;
    import com.dineshonjava.service.EmployeeService;


    @Controller
    public class EmployeeController {

        @Autowired
        private EmployeeService employeeService;







        @RequestMapping(value = "/search", method = RequestMethod.GET)
        public Map<String, Object> search(@ModelAttribute("command")  EmployeeBean employeeBean,
                BindingResult result) {

            Map<String, Object> model = new HashMap<String, Object>();
            model.put("employees",  prepareListofBean(employeeService.listEmployeess()));


            return (model);
        }




        private List<EmployeeBean> prepareListofBean(List<Employee> employees){
            List<EmployeeBean> beans = null;
            if(employees != null && !employees.isEmpty()){
                beans = new ArrayList<EmployeeBean>();
                EmployeeBean bean = null;
                for(Employee employee : employees){
                    bean = new EmployeeBean();
                    bean.setName(employee.getEmpName());
                    bean.setId(employee.getEmpId());
                    bean.setAddress(employee.getEmpAddress());
                    bean.setSalary(employee.getSalary());
                    bean.setAge(employee.getEmpAge());
                    bean.setBloodgrp(employee.getBloodgrp());
                    bean.setAids(employee.getAids());
                    bean.setWeight(employee.getWeight());
                    bean.setPass(employee.getPass());
                    beans.add(bean);
                }
            }
            return beans;
        }


    }



    Angular js page:

This is my angular js page here i try to get data's from Spring mvc controller but it fails . please explain how to get data from spring MVC .im new to angular js and spring mvc this is my task im fresher .

<html>
<head>
<script>
    var app = angular.module('angularjsTable', ['angularUtils.directives.dirPagination']);
     app.controller('listitemdata',function($scope, $http){
         $scope.employees = []; 
         $http.get("http://localhost:8080/sdnext/search").success(function(response){ 
             $scope.employees = response; 
});
});
</script>
</head>
<tbody>
<tr dir-paginate="employee in employees">

<td>{{employee.id}}</td>
<td>{{employee.name}}</td>
<td>{{employee.age}}</td>
<td>{{employee.salary}}</td>
<td>{{employee.address}}</td>
<td>{{employee.bloodgrp}}</td>
<td>{{employee.aids}}</td>
<td>{{employee.weight}}</td>
</tr>
</tbody>

</html>

Raju · Accepted Answer · 2017-11-17 12:53:40Z

1

Dont use any model just send data In response and convert List Of DTO Object in json

 @RequestMapping(value = "/search", method = RequestMethod.GET)
      public void  search(HttpServletResponse res,HttpServletRequest req) {

      List<EmployeeBean> data =  employeeService.listEmployeess();
        JSONArray array = new JSONArray();
            for (EmployeeBean e : data) {
                JSONObject jsonObject = new JSONObject(e);
                array.put(jsonObject);
            }
         response.getWriter().append(array.toString());
        }

in pom.xml for jsonObject

 <dependency>
            <groupId>org.json</groupId>
            <artifactId>json</artifactId>
            <version>20160810</version>
        </dependency>

answered Nov 17, 2017 at 12:53

Raju

4596 silver badges24 bronze badges

Sign up to request clarification or add additional context in comments.

16 Comments

Guvaliour Over a year ago

How to get my data in Angular js page

Raju Over a year ago

josn:developer.mozilla.org/en-US/docs/Learn/JavaScript/Objects/JSON

Guvaliour Over a year ago

How to get this value in angular js page to display the details in JSP page.please some one help to get this value and view it in Angular JS using Ajax call.

Guvaliour Over a year ago

@RequestMapping(value = "/search", method = RequestMethod.GET) public void search(HttpServletResponse res,HttpServletRequest req) throws IOException { List<Employee> data = employeeService.listEmployeess(); JSONArray array = new JSONArray(); for (Employee e : data) { JSONObject jsonObject = new JSONObject(e); array.put(jsonObject); } res.getWriter().append(array.toString()); }

Raju Over a year ago

<tbody ng-app="your appName" ng-controller="your controllerName"> <tr ng-repeat="employee in employees"> <td>{{employee.id}}</td> <td>{{employee.name}}</td> <td>{{employee.age}}</td> <td>{{employee.salary}}</td> <td>{{employee.address}}</td> <td>{{employee.bloodgrp}}</td> <td>{{employee.aids}}</td> <td>{{employee.weight}}</td> </tr> </tbody>

|

Collectives™ on Stack Overflow

How to connect Angular JS with spring mvc using $http service to get data from controller to jsp

1 Answer 1

16 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

16 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related