angularJS中的$http.get错误——成功不是函数[重复]
Posted
技术标签:
【中文标题】angularJS中的$http.get错误——成功不是函数[重复]【英文标题】:Error with $http.get in angularJS -- Success not a Function [duplicate] 【发布时间】:2017-05-02 05:13:37 【问题描述】:得到这个错误:
angular.min.js:122 TypeError: $http.get(...).success 不是函数 在 getUserInfo (app.js:7) 在新的 (app.js:12) 在 Object.invoke (angular.min.js:43) 在 Q.instance (angular.min.js:93) 在 p (angular.min.js:68) 在 g (angular.min.js:60) 在 g (angular.min.js:61) 在 g (angular.min.js:61) 在 angular.min.js:60 在 angular.min.js:21
这是我的代码:
var gitHub = angular.module('gitHub', []);
gitHub.controller('mainController', ['$scope', '$http', function($scope, $http)
var $scope.user = '';
function getUserInfo($scope, $http)
$http.get('https://api.github.com/users')
.success(function (result)
$scope.user = result;
console.log(result);
);
;
getUserInfo($scope, $http);
]);
这里是html
<!DOCTYPE html>
<html ng-app="gitHub">
<head>
<title>Github Users Directory</title>
<script src="angular.min.js"></script>
<script src="app.js"></script>
</head>
<body>
<div ng-controller="mainController">
<div>
<h1>GitHub Users</h1>
Who do you want to search for?<input type="text" name="FindHim" ng-model="queryName" />
<button ng-click="getUserInfo()">Search</button>
</div>
<div>
user
</div>
</div>
</body>
</html>
【问题讨论】:
哪个版本的角度?success
和 error
回调已被弃用,因为(我认为)角度 1.5
.success
和 .error
方法已被弃用,已被 removed from AngularJS 1.6 取代。
【参考方案1】:
我认为您在使用angular 时需要使用.then 而不是.success。
文档中的示例
var promise = asyncGreet('Robin Hood');
promise.then(function(greeting)
alert('Success: ' + greeting);
, function(reason)
alert('Failed: ' + reason);
, function(update)
alert('Got notification: ' + update);
);
下面是 $Http 如何使用它的例子:
// Simple GET request example:
$http(
method: 'GET',
url: '/someUrl'
).then(function successCallback(response)
// this callback will be called asynchronously
// when the response is available
, function errorCallback(response)
// called asynchronously if an error occurs
// or server returns response with an error status.
);
最后你的代码看起来像这样
$scope.getUserInfo = function ()
$http.get('https://api.github.com/users')
.then(function (result)
$scope.user = result;
console.log(result);
, function(result)
//some error
console.log(result);
);
;
【讨论】:
他们需要使用.then()
,尽管.success()
已被弃用。您可能应该举一个例子,尽管它使用 $http
和 .then()
而不是通用的承诺示例。【参考方案2】:
根据您当前的实现,您没有将参数(即$scope
和$http
)从ng-click="getUserInfo()"
传递给getUserInfo
,因此您会收到错误消息。
您不需要将这些作为参数作为$scope
和$http
传递,因为它已经注入控制器并在$scope
中定义函数。
gitHub.controller('mainController', ['$scope', '$http', function($scope, $http)
$scope.user = '';
//Redefined function, without arguments
$scope.getUserInfo = function ()
$http.get('https://api.github.com/users')
.success(function (result)
$scope.user = result;
console.log(result);
);
;
$scope.getUserInfo();
]);
【讨论】:
不要,同样的错误,虽然我可以使用 .then 而不是 .success 方法来做到这一点 借用你的代码给他一个使用 .then 的例子 @devzero,没关系 @ManzurKhanSarguroh,您使用的是哪个版本的angular
?
@Satpal 1.6 版【参考方案3】:
不需要将 $http 作为函数参数传递,因为您已经将 $http 作为依赖项注入到您的控制器中。我对代码做了一些修改。请检查它是否适合您。
var gitHub = angular.module('gitHub', []);
gitHub.controller('mainController', ['$scope', '$http', function ($scope, $http)
$scope.user = '';
$scope.getUserInfo = function()
$http.get('https://api.github.com/users')
.success(function (result)
$scope.user = result;
console.log(result);
);
;
$scope.getUserInfo();
]);
【讨论】:
【参考方案4】:.success
和 .error
方法已被弃用,并已成为 removed from AngularJS 1.6。请改用标准的.then
方法。
$http.get('https://api.github.com/users')
.then(function (response)
var data = response.data;
var status = response.status;
var statusText = response.statusText;
var headers = response.headers;
var config = response.config;
$scope.user = data;
console.log(data);
);
弃用通知
$http
旧承诺方法.success
和.error
已被弃用,并将在 v1.6.0 中删除。请改用标准的.then
方法。— AngularJS (v1.5) $http Service API Reference -- Deprecation Notice.
另见SO: Why are angular $http success/error methods deprecated?。
【讨论】:
【参考方案5】:这行得通
https://docs.angularjs.org/api/ng/service/$http
// Simple GET request example:
$http(
method: 'GET',
url: '/someUrl'
).then(function successCallback(response)
// this callback will be called asynchronously
// when the response is available
, function errorCallback(response)
// called asynchronously if an error occurs
// or server returns response with an error status.
);
【讨论】:
【参考方案6】:$http(
method: 'GET',
url: '....',
headers:
'Authorization': 'Bearer ' + localStorage["token"]
)
.then(function (data, status, headers, config)
alert(JSON.stringify(data) + "Status" + status);
)
.error(function (data, status, headers, config)
alert(JSON.stringify(data) + "Status" + status);
);
【讨论】:
请正确格式化您的代码.error
方法已弃用。而是使用.catch
。【参考方案7】:
你不需要注入 $scope, $http..
app.controller('MainController', function($scope, $http)
$scope.fetchData = function(_city)
$http.get("../api/AllPlaces?filter[where][placeCity]="+ _city)
.then(function(response)
$scope.Data = response.data;
);
);
【讨论】:
【参考方案8】:function successCallback(response)
return response
$http.get('url')
.then(successCallback)
【讨论】:
感谢您提供此代码 sn-p,它可能会提供一些即时帮助。一个正确的解释would greatly improve 其教育价值通过展示为什么这是一个很好的解决问题的方法,并将使它对未来有类似但不相同的问题的读者更有用。请edit您的答案添加解释,并说明适用的限制和假设。【参考方案9】:根据Angular JS $http
documentation,这个系统已经被排除在1.4.3 +
之外所以,我已经从他的post那里得到了帮助,你可以试试这个方法
app.controller('MainCtrl', function ($scope, $http)
$http(
method: 'GET',
url: 'api/url-api'
).then(function (success)
,function (error)
);
或
$http.get('api/url-api').then(successCallback, errorCallback);
function successCallback(response)
//success code
function errorCallback(error)
//error code
我更喜欢第二个,它对我来说更灵活。
【讨论】:
以上是关于angularJS中的$http.get错误——成功不是函数[重复]的主要内容,如果未能解决你的问题,请参考以下文章
AngularJS - $http get 返回状态为 0 的错误?
$ http get不会在AngularJS中抛出成功或错误[重复]