爲什麼我從http服務得到undefined？

Question

我創建$ http服務並使用$ q。

這裏是我的$ http服務：

function dashboardService($http, $log, $q, config) { 

    var service = { 
     getClientId: getClientIDByLayout, 
    }; 

    return service; 

    function getClientIDByLayout(layoutId) { 
     var deferred = $q.defer(); 
     return $http.get(config.baseUrl + "api/ClientLayoutMercator?layoutId=" + layoutId).then(function (result) { 
      deferred.resolve(result.data); 
     }, function (result) { 
      deferred.reject(result); 
     }); 

     return deferred.promise; 
    } 
} 

這裏是我如何調用上述內部控制服務：

dashboardService.getClientId(layoutId).then(function (data) { 
     var t = data;//undifined 
    }); 

但導致我此行var t = data是undefined進去。

任何想法，爲什麼我從服務中得到未定義？

Answer 1

基本上你有兩個return語句在你的getClientIDByLayout函數中，兩者都返回promise本身。正如我可以看到您的當前實現您的創建新的promise &管理拒絕/手動解析。但問題是第一個return語句（return $http.get(）使其他return語句（return deferred.promise）變得多餘。因此，第一個承諾從控制器返回訂閱。最終$http.get不會返回任何內容，因此您可以成功undefined成功。

您可以通過刪除1st return語句輕鬆解決此問題，如下所示。

function getClientIDByLayout(layoutId) { 
    var deferred = $q.defer(); 
    //removed `return` from below code. 
    $http.get(config.baseUrl + "api/ClientLayoutMercator?layoutId=" + layoutId).then(function (result) { 
     deferred.resolve(result.data); 
    }, function (result) { 
     deferred.reject(result); 
    }); 
    //custom promise should get return 
    return deferred.promise; 
} 

---

理想的情況下創造的承諾開銷視爲反模式，而你可以利用通過$http.get返回的承諾。只需從成功回調中返回一個數據即可鎖定承諾。

代碼

function getClientIDByLayout(layoutId) { 
    ̶v̶a̶r̶ ̶d̶e̶f̶e̶r̶r̶e̶d̶ ̶=̶ ̶$̶q̶.̶d̶e̶f̶e̶r̶(̶)̶;̶ 
    return $http.get(config.baseUrl + "api/ClientLayoutMercator?layoutId=" + layoutId) 
     .then(function (result) { 
     //returning data from promise, it will provide it to subsequent `.then` 
     return result.data; 
     }, function (error) { 
     ͟r͟e͟t͟u͟r͟n͟ $q.reject(error); 
     } 
    ); 
} 

Answer 2

代替在.then方法，使用$q.defer，只需return或throw到處理程序的功能的：

function dashboardService($http, $log, ̶$̶q̶,̶ config) { 

    var service = { 
     getClientId: getClientIDByLayout, 
    }; 

    return service; 

    function getClientIDByLayout(layoutId) { 
     ̶v̶a̶r̶ ̶d̶e̶f̶e̶r̶r̶e̶d̶ ̶=̶ ̶$̶q̶.̶d̶e̶f̶e̶r̶(̶)̶;̶ 
     return $http.get(config.baseUrl + "api/ClientLayoutMercator?layoutId=" + layoutId).then(function (result) { 
      ̶d̶e̶f̶e̶r̶r̶e̶d̶.̶r̶e̶s̶o̶l̶v̶e̶(̶r̶e̶s̶u̶l̶t̶.̶d̶a̶t̶a̶)̶;̶ 
      return result.data; 
     }, function (result) { 
      ̶d̶e̶f̶e̶r̶r̶e̶d̶.̶r̶e̶j̶e̶c̶t̶(̶r̶e̶s̶u̶l̶t̶)̶;̶ 
      throw result; 
     }); 

     ̶r̶e̶t̶u̶r̶n̶ ̶d̶e̶f̶e̶r̶r̶e̶d̶.̶p̶r̶o̶m̶i̶s̶e̶;̶ 
    } 
} 

的.then方法返回一個新諾這是通過successCallback的返回值解決或拒絕errorCallback（除非該值是一個承諾，在這種情況下，它將使用promise chaining中的承諾中解決的值來解決）。 ¹

通過錯誤返回與包含函數缺乏return或throw聲明該服務返回該解析爲undefined一個承諾一個then方法的承諾。

欲瞭解更多信息，請參閱You're Missing the Point of Promises。