我是Angular.js的新手，尝试使用工厂通过http post请求发送数据。我收到此错误Cannot read property 'success' of undefined这里是我的代码...在Angular DataFactory中接收来自HTTP POST请求的未定义结果

<!DOCTYPE html> 
<html ng-app="myApp"> 
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> 

<body> 
    <div ng-controller="myCtrl"> 

    </div> 

    <script> 
     var app = angular.module('myApp', []); 

     app.factory('DataFactory', ['$http', function($http) { 
      return { 
       setData: function(stud) { 
        return 
        $http({ 
         method: 'POST', 
         url: 'http://www.w3schools.com/jquery/demo_test_post.asp', 
         headers: { 
          'Content-Type': 'application/x-www-form-urlencoded' 
         }, 
         data: stud 
        }); 

       } 
      } 

     }]); 

     app.controller('myCtrl', function($scope, DataFactory) { 

      var stud = { 
       name: "Alex", 
       city: "Berlin" 
      }; 


      DataFactory.setData(stud).then(function(response) { 
        console.log(response); 
       }) 
       .catch(function(err) { 
        console.error(err) 
       }) 
       .finally(function() { 
        console.log("Finished the chain"); 
       }); 
     }); 
    </script> 

</body> 

</html>

我正的错误是在线路DataFactory.setData（双头）.success ...任何帮助非常感谢......

来源

2016-04-27 h_a86

只是用'。然后（successFn，failFn）'或'。然后（FN）.catch （fn）' –

哪里可以使用.then ...你能举一些例子 –

它只是降价还是你有一个换行和$ http之间的换行符？如果你回到那里，$ http变得无法访问。函数可以低于返回值，因为它们是在代码执行之前注册的。

所以你应该把它写像

return $http({...})

，而不是

return $http({...})

来源

2016-04-27 13:18:58 Kraken

是的，完全同意 –

$http返回Promise。您需要使用.then()注册成功回调。

更一般的形式是.then(successFn, failFn)

来源

2016-04-27 12:56:06

所以docs状态：

var promise = someAsyncMethodCall(); 
promise.then(function(greeting) { 
    alert('Success: ' + greeting); 
}, function(reason) { 
    alert('Failed: ' + reason); 
});

见底部，有2个功能传递给then功能。所以你的代码是：

DataFactory.setData(stud).then(function(response) { 
    console.log(response); 
}, function (err) { 
    console.error(err) 
});

$ q库是$ http在底层使用的。

查看promise api。

有以下方法：

然后（successCallback，errorCallback，notifyCallback） - 无论何时承诺是或将得到解决或拒绝，然后调用成功或错误回调的一个异步的结果可用。回调被调用一个参数：结果或拒绝原因。另外，在承诺被解决或被拒绝之前，通知回叫可以被称为零次或多次以提供进度指示。

该方法返回一个新的承诺，通过successCallback，errorCallback的返回值解析或拒绝该承诺（除非该值是承诺，在这种情况下，它将使用承诺链接中承诺解决的值进行解析）。它还通过notifyCallback方法的返回值进行通知。该承诺无法通过notifyCallback方法解决或拒绝。

赶上（errorCallback） - 速记promise.then（NULL，errorCallback）

最后（回调，notifyCallback） - 让您无论是观察履行或拒绝承诺的，而是做所以不需要修改最终值。这对于释放资源或做一些清理工作是有用的，无论承诺是否被拒绝或解决，都需要进行清理。有关更多信息，请参阅完整规范。

所以要进一步您的代码，你可以这样做：

DataFactory.setData(stud).then(function(response) { 
    console.log(response); 
}) 
.catch(function (err) { 
    console.error(err) 
}) 
.finally(function() { 
    console.log("Finished the chain"); 
});

---编辑---

为了完整起见，还有一个错误@Duncan说，这是该行破解：

app.factory('DataFactory', ['$http', function($http) { 
    return { 
     setData: function(stud) { 
      return 
      $http({ 
       method: 'POST', 
       url: 'http://www.w3schools.com/jquery/demo_test_post.asp', 
       headers: { 
        'Content-Type': 'application/x-www-form-urlencoded' 
       }, 
       data: stud 
      }); 

     } 
    } 

}]);

return和$http({之间的断裂导致的错误。因此，它需要像这样：

app.factory('DataFactory', ['$http', function($http) { 
    return { 
     setData: function(stud) { 
      return $http({ 
       method: 'POST', 
       url: 'http://www.w3schools.com/jquery/demo_test_post.asp', 
       headers: { 
        'Content-Type': 'application/x-www-form-urlencoded' 
       }, 
       data: stud 
      }); 

     } 
    } 

}]);

来源

2016-04-27 12:56:52

感谢您的回复，真正有助于理解JS承诺...我只是改变了代码，并再次获取无法读取属性'then'的undefine d –

@ h_a86你可以再次更新你的代码吗？ –

是的，代码刚刚更新。 –

你的问题是在功能setData()：

   return 
       $http({ 
        method: 'POST', 
        url: 'http://www.w3schools.com/jquery/demo_test_post.asp', 
        headers: { 
         'Content-Type': 'application/x-www-form-urlencoded' 
        }, 
        data: stud 
       });

也就是说两个语句：return从功能刚刚返回，然后调用$http()是额外的代码那永远不会到达。

小心在Javascript中放置换行符的位置，将$http({移到上一行。

哦，和其他人说的一样，使用.success对$http的结果不赞成使用，而是改用普通promise方法。

来源

2016-04-27 13:12:20 Duncan

打败我吧。这是真正的问题。 – DerekMT12

@ DerekMT12有两个“真正”问题，不建议使用的函数和换行符 –

@CallumLinington，但弃用的函数纯粹是一个样式问题：代码仍然会对调用不推荐使用的函数运行。 – Duncan

在Angular DataFactory中接收来自HTTP POST请求的未定义结果

回答

---编辑---

相关问题