angularJs中的then（）

在使用Angular JS的过程中，有些细节理解起来有点费事，例如其中的 then() 函数。

总的来说有一个功能，用Angular JS的post方法向后台发送请求，然后后台返回一段数据交个Angular 来进行处理，先看看service部分：

[javascript] 
fs.services.factory('MonitorService', ['$http', '$q', function ($http, $q) {  
    return {  
        queryByYearOrMonth: function (postData) {  
            var delay = $q.defer();  
            $http.post(fs.common.baseResourceURL2 + '/api/monitor/uploadQuantity', postData,{})  
                 .success(function (data) {  
                    delay.resolve(data);  
                }).error(function () {  
                    delay.reject("Can't search uploadQuantity data.");  
                });   
            return delay.promise;  
        }  
    }  
}]);  

如果不经过深入测试的话，第一反应是觉得 delay.resolve(data)这句在处理数据，把数据放在delay对象的promise中，因为最后一句是return delay.promise，想当然地认为

delay.promise就是已经处理好的可以交给controller使用的数据，但经过实际测试，发现不是这么回事。

那就来看看delay.promise到底是什么？在浏览器控制台中，以此输出delay.promise中的属性和值，如下：

[javascript]

then: function (callback, errback) {  
          var result = defer();  
  
          var wrappedCallback = function(value) {  
            try {  
              result.resolve((callback || defaultCallback)(value));  
            } catch(e) {  
              exceptionHandler(e);  
              result.reject(e);  
            }  
          };  
  
          var wrappedErrback = function(reason) {  
            try {  
              result.resolve((errback || defaultErrback)(reason));  
            } catch(e) {  
              exceptionHandler(e);  
              result.reject(e);  
            }  
          };  
  
          if (pending) {  
            pending.push([wrappedCallback, wrappedErrback]);  
          } else {  
            value.then(wrappedCallback, wrappedErrback);  
          }  
  
          return result.promise;  
        }   
always: function (callback) {  
            
          function makePromise(value, resolved) {  
            var result = defer();  
            if (resolved) {  
              result.resolve(value);  
            } else {  
              result.reject(value);  
            }  
            return result.promise;  
          }  
            
          function handleCallback(value, isResolved) {  
            var callbackOutput = null;              
            try {  
              callbackOutput = (callback ||defaultCallback)();  
            } catch(e) {  
              return makePromise(e, false);  
            }              
            if (callbackOutput && callbackOutput.then) {  
              return callbackOutput.then(function() {  
                return makePromise(value, isResolved);  
              }, function(error) {  
                return makePromise(error, false);  
              });  
            } else {  
              return makePromise(value, isResolved);  
            }  
          }  
            
          return this.then(function(value) {  
            return handleCallback(value, true);  
          }, function(error) {  
            return handleCallback(error, false);  
          });  
        }   

有两个部分，then 和 always，两个都是可执行的方法。

always 这里不作讨论。来看看then ，它有两个参数，callback 和 errback， 第一个用来处理“resolved”和“success”事件；第二个用来处理“rejected”和“failure”事件。

所以，delay.promise不是现成的数据，还不能直接使用。然后来看看这个then怎么使用（主要是如何从中提取出我们需要的后台返回的数据）：

[javascript]

uploadQuantityLoader(params).then(function(Cquantity){  
        $scope.quantityMap = Cquantity.quantityMap;  
        makeGraph();      
    });  

then(fn) 方法中带一个参数，这个参数就是要被执行的函数，并且，这个作为参数的函数本身有一个参数，这个参数就是我们需要的数据，这里是关键，本例中也就是
Cquantity，然后这个Cquantity就可以放在函数里面进行处理了。