Question

我正在将wcf服务用于angular js应用程序。我试图在角度js应用程序中检索单个记录。但问题是它不显示数据。我调试应用程序并把断点。尽管我在输入字段中输入了有效文本，但它没有达到sql数据读取器行代码。它始终执行连接.close方法。

这是界面。

   [OperationContract]

        [WebInvoke(Method = "POST",
        RequestFormat = WebMessageFormat.Json,
        ResponseFormat = WebMessageFormat.Json,
        UriTemplate = "/GetCustomers/{prefix}")]
        string GetCustomers(string prefix);

这是实施。

   public string GetCustomers(string prefix)
        {

            List<object> customers = new List<object>();
            string sql = "SELECT * FROM Current_Account_Holder_Details WHERE Account_Holder_Last_Name LIKE @prefix + '%'";
            using (SqlConnection conn = new SqlConnection())
            {
                conn.ConnectionString = ConfigurationManager.ConnectionStrings["DBCS"].ConnectionString;
                using (SqlCommand cmd = new SqlCommand(sql))
                {
                    cmd.Parameters.AddWithValue("@prefix", prefix);
                    cmd.Connection = conn;
                    conn.Open();
                    using (SqlDataReader sdr = cmd.ExecuteReader())// Hit on this line 
                    {
                        while (sdr.Read())// Not hitting this line 
                        {

                            customers.Add(new
                            {
                                Tittle = sdr["Tittle"],
                                Account_Holder_First_Name = sdr["Account_Holder_First_Name"],
                                Account_Holder_Last_Name = sdr["Account_Holder_Last_Name"],
                                Account_Holder_DOB = sdr["Account_Holder_DOB"],
                                Account_Holder_House_No = sdr["Account_Holder_House_No"],
                                Account_Holder_Street_Name = sdr["Account_Holder_Street_Name"],
                                Account_Holder_Post_Code = sdr["Account_Holder_Post_Code"],

                                Account_Holder_Occupation = sdr["Account_Holder_Occupation"],
                                Account_Number = sdr["Account_Number"]



                            });
                        }
                    }
                    conn.Close();// After reader hit this line 
                }

                return (new JavaScriptSerializer().Serialize(customers));
            }

        }

这是HTML CODE。

@{
    Layout = null;
}

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
</head>
<body>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.9/angular.min.js"></script>
    <script type="text/javascript">
        var app = angular.module('MyApp', [])
        app.controller('MyController', function ($scope, $http, $window) {
            $scope.IsVisible = false;
            $scope.Search = function () {
                var post = $http({
                    method: "POST",
                    url: "http://localhost:52098/HalifaxIISService.svc/GetCustomers/{prefix}",
                    dataType: 'json',
                    data: { prefix: $scope.Prefix },
                    headers: { "Content-Type": "application/json" }
                });

                post.success(function (data, status) {
                    $scope.Customers = eval(data.d);
                    $scope.IsVisible = true;
                });

                post.error(function (data, status) {
                    $window.alert(data.Message);
                });
            }
        });
    </script>
    <div ng-app="MyApp" ng-controller="MyController">
        Name:
        <input type="text" ng-model="Prefix" />
        <input type="button" value="Submit" ng-click="Search()" />
        <hr />
        <table cellpadding="0" cellspacing="0" ng-show="IsVisible">
            <tr style="height: 30px; background-color: skyblue; color: maroon;">
                <th> Account Number</th>
                <th>Account Creation date</th>
                <th>Account Type</th>
                <th> Sort code</th>
                <th>Account Fee</th>
                <th>Account Balance</th>
                <th>Overdraft Limit</th>


            </tr>
            <tbody ng-repeat="m in Customers">
                <tr>
                    <td>{{m.Tittle}}</td>
                    <td>{{m.Account_Holder_First_Name}}</td>
                    <td>{{m.Account_Holder_Last_Name}}</td>

                    <td>{{m.Account_Holder_DOB}}</td>
                    <td>{{m.Account_Holder_House_No}}</td>
                    <td>{{m.Account_Holder_Street_Name}}</td>
                    <td>{{m.Account_Holder_Post_Code}}</td>

                    <td>{{m.Account_Holder_Occupation}}</td>
                    <td>{{m.Account_Number}}</td>
                </tr>
            </tbody>
        </table>
    </div>
</body>
</html>

以下是申请的结果。

Answer 1

将其更改为：

var post = $http({
    method: "POST",
    url: "localhost:52098/HalifaxIISService.svc/GetCustomers",
    //dataType: 'json',
    data: { prefix: $scope.Prefix },
    //headers: { "Content-Type": "application/json" }
    headers: {
              'Accept': 'application/json, text/javascript, */*; q=0.01',
              'Content-Type': 'application/json; charset=utf-8'
            }
  });

Angular JS Application无法使用wcf rest service

1 个答案: