$http get 不会在 AngularJS 中抛出成功或错误
$http get does not throw success or error in AngularJS
下面是WCFRESTful服务对GET
的声明
[OperationContract]
[WebGet(UriTemplate= "MemberSearch/{MemberName}", ResponseFormat=WebMessageFormat.Json,RequestFormat=WebMessageFormat.Json,BodyStyle=WebMessageBodyStyle.Wrapped)]
string MemberSearch(string MemberName);
下面是我创建的RESTful服务
public string MemberSearch(string MemberName)
{
string MemberId = string.Empty;
string strSqlConn = string.Empty;
SqlConnection sqlCon = new SqlConnection(ConfigurationManager.ConnectionStrings["sqlCon"].ConnectionString);
sqlCon.Open();
SqlCommand sqlCom = new SqlCommand("Select MemberId From Member Where MemberName Like '%" + MemberName + "%'");
sqlCom.CommandType = System.Data.CommandType.Text;
sqlCom.Connection = sqlCon;
SqlDataReader rd = sqlCom.ExecuteReader();
while (rd.Read())
{
MemberId = Convert.ToString(rd["MemberId"]);
}
return MemberId;
}
下面是table
中的数据
MemberId MemberName
1 John
2 Mike
3 Gracy
4 Smith
下面是AngularJS中的调用代码
var app = angular.module("app", []);
app.controller("main", function ($scope, $http) {
var MemberName = "Jo";
$scope.keyword = '';
$scope.GetAllData = function () {
$http.get('http://localhost/MemberEligibilityDemo/MemberService.svc/MemberSearch/' + MemberName)
.success(function (data, status, headers, config) {
$scope.Details = data;
})
.error(function (data, status, header, config) {
$scope.ResponseDetails = "Data: " + data +
"<br />status: " + status +
"<br />headers: " + jsonFilter(header) +
"<br />config: " + jsonFilter(config);
});
};
});
Angular 代码既不会成功也不会出错
网址如下
http://localhost/MemberEligibilityDemo/MemberService.svc/MemberSearch/
调用位置如下
http://localhost/Caller
WCF RESTful 服务的结果如下
{"MemberSearchResult":"1"}
编辑
调用地址如下
<body ng-app="app">
<table id="tblContainer" ng-controller="main">
<tr>
<td><input type="button" name="DisplayDetails" value="Display Details" ng-click="GetAllData()"></td>
</tr>
<tr>
<td>
<p ng-bind="ResponseDetails"></p>
{{ResponseDetails}}
</td>
</tr>
</table>
为什么在 AngularJS 代码中没有执行成功或错误。
您应该将 $http
函数更改为:
$http.get('http://localhost/MemberEligibilityDemo/MemberService.svc/MemberSearch/' + MemberName)
.then(function(resp) {
$scope.Details = resp.data;
}, function(err) {
var data = err.data;
var status = err.status;
var header = err.header;
var config = err.config;
$scope.ResponseDetails = "Data: " + data +
"<br />status: " + status +
"<br />headers: " + jsonFilter(header) +
"<br />config: " + jsonFilter(config);
});
My answer assumes that you have a button or link that is calling this from your UI.
我还猜测您正在迭代用户列表 (ng-repeat
),建议将您的方法更改为以下内容,并像这样调用:GetAllData(memberId)
.
$scope.GetAllData = function (memberId) {
$http.get('http://localhost/MemberEligibilityDemo/MemberService.svc/MemberSearch/' + memberId)
// abbreviated
}
下面是WCFRESTful服务对GET
的声明[OperationContract]
[WebGet(UriTemplate= "MemberSearch/{MemberName}", ResponseFormat=WebMessageFormat.Json,RequestFormat=WebMessageFormat.Json,BodyStyle=WebMessageBodyStyle.Wrapped)]
string MemberSearch(string MemberName);
下面是我创建的RESTful服务
public string MemberSearch(string MemberName)
{
string MemberId = string.Empty;
string strSqlConn = string.Empty;
SqlConnection sqlCon = new SqlConnection(ConfigurationManager.ConnectionStrings["sqlCon"].ConnectionString);
sqlCon.Open();
SqlCommand sqlCom = new SqlCommand("Select MemberId From Member Where MemberName Like '%" + MemberName + "%'");
sqlCom.CommandType = System.Data.CommandType.Text;
sqlCom.Connection = sqlCon;
SqlDataReader rd = sqlCom.ExecuteReader();
while (rd.Read())
{
MemberId = Convert.ToString(rd["MemberId"]);
}
return MemberId;
}
下面是table
中的数据MemberId MemberName
1 John
2 Mike
3 Gracy
4 Smith
下面是AngularJS中的调用代码
var app = angular.module("app", []);
app.controller("main", function ($scope, $http) {
var MemberName = "Jo";
$scope.keyword = '';
$scope.GetAllData = function () {
$http.get('http://localhost/MemberEligibilityDemo/MemberService.svc/MemberSearch/' + MemberName)
.success(function (data, status, headers, config) {
$scope.Details = data;
})
.error(function (data, status, header, config) {
$scope.ResponseDetails = "Data: " + data +
"<br />status: " + status +
"<br />headers: " + jsonFilter(header) +
"<br />config: " + jsonFilter(config);
});
};
});
Angular 代码既不会成功也不会出错
网址如下
http://localhost/MemberEligibilityDemo/MemberService.svc/MemberSearch/
调用位置如下
http://localhost/Caller
WCF RESTful 服务的结果如下
{"MemberSearchResult":"1"}
编辑
调用地址如下
<body ng-app="app">
<table id="tblContainer" ng-controller="main">
<tr>
<td><input type="button" name="DisplayDetails" value="Display Details" ng-click="GetAllData()"></td>
</tr>
<tr>
<td>
<p ng-bind="ResponseDetails"></p>
{{ResponseDetails}}
</td>
</tr>
</table>
为什么在 AngularJS 代码中没有执行成功或错误。
您应该将 $http
函数更改为:
$http.get('http://localhost/MemberEligibilityDemo/MemberService.svc/MemberSearch/' + MemberName)
.then(function(resp) {
$scope.Details = resp.data;
}, function(err) {
var data = err.data;
var status = err.status;
var header = err.header;
var config = err.config;
$scope.ResponseDetails = "Data: " + data +
"<br />status: " + status +
"<br />headers: " + jsonFilter(header) +
"<br />config: " + jsonFilter(config);
});
My answer assumes that you have a button or link that is calling this from your UI.
我还猜测您正在迭代用户列表 (ng-repeat
),建议将您的方法更改为以下内容,并像这样调用:GetAllData(memberId)
.
$scope.GetAllData = function (memberId) {
$http.get('http://localhost/MemberEligibilityDemo/MemberService.svc/MemberSearch/' + memberId)
// abbreviated
}