AngularJs錯誤無法讀取屬性 '然後' 未定義

Question

這是模塊

(function(){ 

    /** 
    * app Module 
    * 
    * Description 
    */ 
    angular.module('app',[]); 
})(); 

我有這樣的服務

(function(){ 
    'use strict'; 

angular 
    .module('app') 
    .factory('homeservice',homeservice); 

homeservice.$inject = ['$http'] 

function homeservice($http){ 

    var service = { 
     test : test 
    } 
    return service; 

    /** 
    * get articles 
    * @return {[type]} [description] 
    */ 
    function test(){ 
     $http.get('/test') 
     .then(testSuccess) 
     .catch(testError) 

     function testSuccess(response){ 
     return response.data; 
     //console.log(response.data) this line prints data to console 
     } 

     function testError(error){ 
     return error; 
     } 
    } 
} 
})(); 

這是我的控制器，它調用函數

(function(){ 


angular.module('app') 
     .controller('HomeController',HomeController); 

    HomeController.$inject = ['homeservice'] 
    function HomeController(homeservice) { 
     var vm = this; 

     test(); 

     function test(){ 
      homeservice.test().then(function(response){ 
       console.log(response); 
      }); 
     } 

    } 
    })(); 

我一直出現錯誤 - 無法讀取未定義的屬性'then'當我在我的控制器中調用方法。我以前使用過這種方式，它工作正常。

ANSWER

function test(){ 
      return $http.get('/test') // return was missing here 
      .then(testSuccess) 
      .catch(testError) 

      function testSuccess(response){ 
      return response.data; 
      //console.log(response.data) this line prints data to console 
      } 

      function testError(error){ 
      return error; 
      } 
     } 

我錯過了在$ http.get（ '/測試'）回報

Answer 1

這

homeservice.test().then(function(response){ ... }); 

假定test方法應返回一個承諾。它返回undefined，這就是錯誤所說的。

應該

/** 
* get articles 
* @return {[type]} [description] 
*/ 
function test(){ 
    return $http.get('/test') 
    .then(testSuccess) 
    .catch(testError) 

    ... 
} 

Answer 2

它不應該是：

$http.get('/test') 
    .success(successFunction) 
    .error(errorFunction); 

至少，這是版本< 1.4.8

適用版本> 1.4.8試試這個：

$http.get('/test') 
    .then(
    function(response) { }, // success 
    function(response) { } // failure 
); 

Answer 3

(function(){ 
    'use strict'; 

angular 
    .module('app') 
    .factory('homeservice',homeservice); 

homeservice.$inject = ['$http'] 

function homeservice($http){ 
    return { 
     test: function() { 
      console.log("inside function"); 
      return $http.get('stats.json'); 
     } 
    }; 
} 
})(); 

DEMO

Answer 4

的測試功能需要回報的$http承諾：

function test(){ 
    ͟r͟e͟t͟u͟r͟n͟ $http.get('/test') 
//^^^^^^ ---------------------RETURN the $http promise 
    .then(testSuccess) 
    .catch(testError) 

    function testSuccess(response){ 
    return response.data; 
    } 

    function testError(error){ 
    ̶r̶e̶t̶u̶r̶n̶ ̶e̶r̶r̶o̶r̶;̶ 
    //throw to chain rejection 
    throw error; 
    } 
} 

的return語句在成功和錯誤處理程序不值返回到上一級功能。將return陳述放在層次結構的每個級別。

---

拒絕再次引發了舊版本的AngularJS

以前（< 1.6版本），從承諾的onFulfilled或onRejection處理錯誤thrown也將傳遞到$exceptionHandler()（除了拒絕承諾以錯誤爲理由）。

要通過返回一個拒絕承諾避免在控制檯中的錯誤信息與舊版本，再次拋出：

function onRejection(error){ 
    ̶r̶e̶t̶u̶r̶n̶ ̶e̶r̶r̶o̶r̶;̶ 
    console.log(error.status); 
    //throw to chain rejection 
    return $q.reject(error); 
    } 

一個常見的問題新手程序員被拒絕的承諾得到錯誤轉換來實現的諾言。從拒絕處理程序重新拋出錯誤對於非常重要。

同樣，當一個功能省略return statement，該函數返回的undefined的值錯誤地轉換一個甩來解析爲的undefined的值的履行承諾。

從文檔：

由於e13eea，從承諾的onFulfilled或onRejection處理程序引發的錯誤處理完全一樣，經常拒絕。在此之前，它也會被傳遞給$exceptionHandler()（除了拒絕承諾並將錯誤作爲原因）。

— AngularJS Developer Guide - Migrating to v1.6 ($q)