如何在angular js页面中获取此值以在JSP页面中显示详细信息。请帮助获取此值并使用Ajax调用在Angular JS中查看它。
@Controller
public class EmployeeController {
@Autowired
private EmployeeService employeeService;
@RequestMapping(value = "/iwill", method = RequestMethod.GET)
public ModelAndView searchd() {
return new ModelAndView("search");
}
@RequestMapping(value = "/search", method = RequestMethod.GET)
public @ResponseBody 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());
}
}
我的Angular js页面:
<!doctype html>
<html >
<head>
<title>Spring MVC + AngularJS Demo</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.min.js"></script>
<script>
function Hello($scope, $http) {
$http.get('http://localhost:8080/sdnext/search.html').
success(function(response) {
$scope.employees = response.data;
});
}
</script>
</head>
<body ng-app="app">
<table>
<tr>
<th>Id</th>
<th>Name</th>
<th>Age</th>
<th>salary</th>
<th>Address</th>
<th>BloodGrp</th>
<th>Aids</th>
<th>Weight</th>
</tr>
<tr>
<tbody ng-controller="Hello">
<tr ng-repeat="employee in employees">
<td>{{employee.empId}}</td>
<td>{{employee.empName}}</td>
<td>{{employee.empAge}}</td>
<td>{{employee.salary}}</td>
<td>{{employee.empAddress}}</td>
<td>{{employee.bloodgrp}}</td>
<td>{{employee.aids}}</td>
<td>{{employee.weight}}</td>
</tr> </tbody>
</table>
</body>
</html>
**
我的JSON回复如下: 我正在使用网址http://localhost:8080/sdnext/search.html,但我不知道如何在Angular js中使用它来在jsp页面中显示我的数据。
**
[{"empId":1,"bloodgrp":"0-ve","empName":"krishnaKumars","weight":78,"aids":"negative","empAge":23,"salary":15000,"empAddress":"madurai"},{"empId":2,"bloodgrp":"o-ve","empName":"Archanasundar","weight":68,"aids":"Negative","empAge":31,"salary":50000,"empAddress":"chennai"},{"empId":4,"bloodgrp":"o-ve","empName":"Kabali","weight":78,"aids":"negative","empAge":23,"salary":201300,"empAddress":"Madurai"}]
答案 0 :(得分:1)
您需要在“/ search”
处从angular $ http.get发出ajax请求这会起作用
@RequestMapping(value = "/search", method = RequestMethod.GET, produces = MediaType.APPLICATION_JSON_VALUE)
public List<Employee> search( ) throws IOException {
return employeeService.listEmployeess();
}
你在那里犯了一个错误
function Hello($scope, $http) {
$http.get('http://localhost:8080/sdnext/search.html').
success(function(response) {
$scope.employees = pesponse;
});
}
$ scope.employees = response.data是正确的
应该是这样的
<script>
angular.module("app",[])
.controller("Hello",function ($scope,$http){
$scope.getData = function() {
$http.get('http://localhost:8080/sdnext/search.html').
success(function(response) {
$scope.employees = response.data;
});
}
});
</script>
也
<tbody ng-controller="Hello" ng-init="getData ()">
检查这些是否有效