问题描述：
获取不到$http请求成功后返回的数据
产生错误的代码分析：
//根据书籍大类的id值从数据库中获得书籍信息
var getBookInfo=function (cateId){
postData='book.category.categoryId='+cateId;
return $http({
method:'POST',
url:'book-getBooksByCategory.action',
data:postData,//已序列化用户输入的数据
headers:{'Content-Type': 'application/x-www-form-urlencoded' } //当POST请求时，必须添加的
}).then(function(response){
console.log(response); //打印响应数据（采用then方法获得的响应数据比用success方法获得的响应数据信息多）
return response.data;//将响应数据的data属性值返回
});
}
//高亮显示当前商家查看的书籍大类并从数据库中查书籍信息
$('.book-big-categorys a').click(function(){
var categoryId=$(this).attr('data-id');
var bookInfo,
reData;
$('.book-big-categorys a').css('color','#656565');
$(this).css('color','#ddbea1');//高亮显示当前点击的书籍大类名称
reData=getBookInfo(categoryId); //调用getBookInfo()函数，期望得到响应数据
console.log(reData); //打印出来是promise对象（不是期望得到的）
bookInfo=reData.value; //根本就获取不到值
console.log(bookInfo); //undefined
});
上述代码的运行结果：（上述三个console.log的结果，由上到下）
图片.png
很明显期望得到的值为undefined（不是我们想要的）
解决办法：
将调用getBookInfo的方法改一下
原因分析：采用$http的then方法后，虽然可以得到其返回值，但是返回值为promise对象，这是通过异步请求得到的，所以普通的函数调用方法得不到其返回值，只有对promise对象再用then方法才可以得到，下述代码时改动后的代码（只改动了函数调用部分）
//高亮显示当前商家查看的书籍大类并从数据库中查书籍信息
$('.book-big-categorys a').click(function(){
var categoryId=$(this).attr('data-id');
var bookInfo,
reData;
$('.book-big-categorys a').css('color','#656565');
$(this).css('color','#ddbea1');//高亮显示当前点击的书籍大类名称
getBookInfo(categoryId).then(function(myData){
console.log(myData.books[0]);
console.log('我执行了');
});
});
对上述代码进行截屏分析：
图片.png
扩展：
$http的success()方法其实就是和then()方法差不多，只是在方法内部调用了then()方法，并且解构了 then 方法传递给回调方法的参数，也就是说使用success()方法得到的 response 比then()精简，少一些数据，这算是Angular中的一个语法糖。
注意，还有一个重要的区别，就是使用success()方法无法使外部获取到最后回调函数中返回的数据：
图片.png
上面的数据是无法打印出来，因为数据并没有直接返回出来，这是success()内部实现机制造成的，如果想要打印出返回的数据这时就要使用then()方法。
为了避免造成不可遇见bug，还是建议在项目中都使用then()方法，保持整个项目代码风格的一致性。
感谢：
AngularJS中$http.success()与$http.then()方法
Angular http returns $$state object
