项目是ssm+angularJS。其中一个模块设计到页面的跳转并携带参数。如下图所示id=1,点击查看按钮跳转实现查看id=1的同学详情。
查看资料网络普遍采用ui-router,我配置了几次没有成功。尝试了另外的方法。特此记录。
- 首先在当前页的html中给button设置一个事件,并获取将要传递的id。
<button type="button" class="btn bg-olive btn-xs" ng-click="toDetails(sid=entity.id)" >查看</button>
- 当前页的JS 的controller层:传递参数并跳转页面
app.controller('studentController',function($scope,$http){
$scope.toDetails=function (sid) {
var hre = '4-studentDetails.html?id=' +sid; //跳转页
location.href = hre;
};
});
- 跳转页。在跳转页首先接受整个地址,并分割参数id。然后向controller层带上参数发起请求。
app.controller('stuController',function($location,$scope,$http){
//接收参数
$scope.viewStudent=function(){
var urlValue='';
var href = location.href;
urlValue = href.substr(href.indexOf("=") + 1);
message=angular.fromJson(decodeURI(urlValue));
//向后端controller层发起请求
$http.get('../student/viewDetails.do?id='+message).success(
function(response){
$scope.list=response;
}
);
};
});
- 后端:接受请求并返回json给前端
@ResponseBody
@RequestMapping("/viewDetails")
public List<Student> learnDetails(Student student){
List<Student> stuList = studentService.queryStuById(student.getId());
return stuList;
}
参考文献:
[1]:https://blog.csdn.net/xuehu837769474/article/details/80445417#commentBox
觉得有用,点个赞再走吧~