javascript - 无法使用 Wcf 服务在 Angular JS 中根据 ID 检索单个记录

标签 javascript angularjs wcf

我正在尝试使用 wcf Rest 服务检索 Angular JS 应用程序中的单个记录。我在 google chrome 中检查了控制台窗口。我收到以下错误..

Failed to load resource: the server responded with a status of 404 (Not Found)

这是界面..

     [OperationContract]
            [WebInvoke(Method = "GET",
              RequestFormat = WebMessageFormat.Json,
              ResponseFormat = WebMessageFormat.Json,
              UriTemplate = "/AccountBalanceCheek")]
            AccountBalanceRequest AccountBalanceCheek(AccountBalanceRequest accountNumber);

这是实现。

   public AccountBalanceRequest AccountBalanceCheek(AccountBalanceRequest accountNumber)
        {
            using (SqlConnection conn = new SqlConnection(ConnectionString))
            {
                conn.Open();

                var cmd = new SqlCommand("SELECT * FROM Current_Account_Details WHERE Account_Number = '" + accountNumber.Account_Number + "'", conn);


                cmd.CommandType = CommandType.Text;

                var reader = cmd.ExecuteReader();
                //read the result of the execute command.
                while (reader.Read())
                {
                    //assuming that your property is the same as your table schema. refer to your table schema Current_Account_Details

                    accountNumber.Account_Number= reader["Account_Number"].ToString();
                    accountNumber.Account_Creation_Date = reader["Account_Creation_Date"].ToString();

                    accountNumber.Account_Type = reader["Account_Type"].ToString();
                    accountNumber.Branch_Sort_Code = reader["Branch_Sort_Code"].ToString();
                    accountNumber.Account_Fees = reader["Account_Fees"].ToString();
                    accountNumber.Account_Balance = reader["Account_Balance"].ToString();
                    accountNumber.Over_Draft_Limit = reader["Over_Draft_Limit"].ToString();
                }
                return accountNumber;
            }
        }

这是我的脚本代码..

var app = angular.module("WebClientModule", [])
    .controller('Web_Client_Controller', ["$scope", 'myService', function ($scope, myService) {
    var Id = $scope.Account_Number;
    $scope.search = function (Id) {
        var promiseGetSingle = myService.getbyId(Id);

        promiseGetSingle.then(function (pl) {
            var res = pl.data;
            $scope.Account_Number = res.Account_Number;
            $scope.Account_Creation_Date = res.Account_Creation_Date;
            $scope.Account_Type = res.Account_Type;
            $scope.Branch_Sort_Code = res.Branch_Sort_Code;
            $scope.Account_Fees = res.Account_Fees;
            $scope.Account_Balance = res.Account_Balance;
            $scope.Over_Draft_Limit = res.Over_Draft_Limit;

            //   $scope.IsNewRecord = 0;
        },
            function (errorPl) {
                console.log('failure loading Employee', errorPl);
            });
    }
    }]);




app.service("myService", function ($http) {

    this.getbyId = function (Id) {
        return $http.get("http://localhost:52098/HalifaxIISService.svc/AccountBalanceCheek" + Id);
    };
   })

这是 html。

@{
    Layout = null;
}

<!DOCTYPE html>

<html ng-app="WebClientModule">
<head>
    <meta name="viewport" content="width=device-width" />

    <title>AccountBalance</title>
    <script src="~/Scripts/angular.min.js"></script>
    <script src="~/RegistrationScript/AccountBalance.js"></script>

</head>
<body>
    <div ng-controller="Web_Client_Controller">
        Enter Account_Number: <input type="text" ng-model="Account_Number" />
        <input type="button"  value="search" ng-click="search(Account_Number)" />

            <table id="tblContainer" data-ng-controller="Web_Client_Controller">
                <tr>
                    <td>
                        <table style="border: solid 2px Green; padding: 5px;">
                            <tr style="height: 30px; background-color: skyblue; color: maroon;">
                                <th></th>
                                <th>Account Number</th>
                                <th>Account Creation Date</th>
                                <th>Account Type</th>
                                <th>Branch Sort Code</th>
                                <th>Account Fees</th>
                                <th>Account Balance</th>
                                <th>Over Draft Limit</th>

                                <th></th>
                                <th></th>
                            </tr>
                            <tbody data-ng-repeat="user in Users">
                                <tr>
                                    <td></td>
                                    <td><span>{{user.Account_Number}}</span></td>
                                    <td><span>{{user.Account_Creation_Date}}</span></td>
                                    <td><span>{{user.Account_Type}}</span></td>
                                    <td><span>{{user.Branch_Sort_Code}}</span></td>

                                    <td><span>{{user.Account_Fees}}</span></td>
                                    <td><span>{{user.Account_Balance}}</span></td>
                                    <td><span>{{user.Over_Draft_Limit}}</span></td>
                                    <td>

                                </tr>
                            </tbody>
                        </table>
                    </td>
                </tr>
                <tr>
                    <td></td>
                </tr>
                <tr>
                    <td>

                        <div style="color: red;">{{Message}}</div>

                    </td>
                </tr>
            </table>
        </div>
        </body>


</html>

她的是谷歌浏览器中的应用结果..

click here to see the oput put

最佳答案

如果您收到 404 not font 错误,则意味着您的端点地址有问题。首先尝试使用 fiddler 或 postman 使用您的服务,并确保您的服务成功加载。然后跟踪您的 Angular 请求以确保您的客户端代码有效。

关于javascript - 无法使用 Wcf 服务在 Angular JS 中根据 ID 检索单个记录,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47026507/

相关文章:

JavaScript:循环遍历字符串,如果字符串第一个字母包含元音,则返回字符串 + 'ay'

Asp.Net MVC 中的 Javascript 多文件 uploader 错误 : cancel button doesn't work

javascript - 从 mousedown Angularjs 上的指令更新范围

javascript - 我如何 Jest 模拟 Date.toLocaleDateString?

javascript - 过滤数据后打开模态 Bootstrap

c# - 为什么 System.ServiceModel.Persistence 过时了?

.net - 带有加扰的非 ASCII 字符的 JSONP 字符串

wcf - 自定义 SOAP 错误具有错误的命名空间 http ://schemas. datacontract.org/2004/07/

javascript - 将视频添加到 AngularJs 图像 slider (ui.bootstrap.carousel)

javascript - 针对 Restful API 的 Angular 登录/身份验证