Wcf REST服务DELETE方法在Angular JS Application中未定义

时间:2017-10-18 02:05:40

标签: javascript angularjs rest wcf

我正在将wcf rest服务用于Angular JS Application。但我可以删除Angular Js Application中的帖子。我从localhost访问该方法,结果我得到了End Point not Found.I检查了调试模式。我收到了以下错误。

The creator of this fault did not specify a Reason.

我查看了Google Chrome控制台窗口。我得到了这个结果..

DELETE http://localhost:52098/HalifaxIISService.svc/DeleteCreateCurrentAccount/undefined 400 (Bad Request)

这是界面。

   [OperationContract]
        [WebInvoke(Method = "DELETE",
        RequestFormat = WebMessageFormat.Json,
        ResponseFormat = WebMessageFormat.Json,
        UriTemplate = "DeleteCreateCurrentAccount/{Id}")]
        void DeleteCreateCurrentAccount(string Id);

这是实施。

 public void DeleteCreateCurrentAccount(string Id)
        {
            try
            {
                int strId = Convert.ToInt32(Id);
                Current_Account_Details std = ctx.Current_Account_Details.Where(rec => rec.Account_Number == strId).FirstOrDefault();
                ctx.Current_Account_Details.Remove(std);
                ctx.SaveChanges();
            }
            catch (Exception ex)
            {
                throw new FaultException<string>
                        (ex.Message);
            }
        }

这是我的脚本代码。

/// <reference path="../angular.min.js" />  



var app = angular.module("WebClientModule", [])

    .controller('Web_Client_Controller', ["$scope", 'myService', function ($scope, myService) {

        $scope.OperType = 1;
        GetAllRecords();
        //To Get All Records  
        function GetAllRecords() {
            var promiseGet = myService.getAllStudent();
            promiseGet.then(function (pl) { $scope.Users = pl.data },
                function (errorPl) {
                    $log.error('Some Error in Getting Records.', errorPl);
                });
        }
        //1 Mean New Entry  

        //To Clear all input controls.  
        function ClearModels() {
            $scope.OperType = 1;
            $scope.Account_Creation_Date = "";
            $scope.Account_Type = "";
            $scope.Branch_Sort_Code = "";
            $scope.Account_Fees = "";
            $scope.Account_Balance = "";
            $scope.Over_Draft_Limit = "";


        }


        $scope.update = function () {


            //Edit the Record
            debugger;
            User.Id = $scope.Id;
            var promisePut = myService.put($scope.Id, User)
            promisePut.then(function (p1) {
                $scope.Message = "Record is Update;"
                GetAllRecords();
                ClearModels();

            }, function (err) {
                console.log("Some Error Occured." + err);
            });
        };


        //To Get Student Detail on the Base of Student ID  
        $scope.get = function (User) {
            var promiseGetSingle = myService.get(User.Account_Number);
            promiseGetSingle.then(function (pl) {
                var res = pl.data;
                $scope.Id = res.Id;
                $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.OperType = 0;
            },
                function (errorPl) {
                    console.log('Some Error in Getting Details', errorPl);
                });
        }
        //To Delete Record  
        $scope.delete = function (User) {
            var promiseDelete = myService.delete(User.Account_Number);
            promiseDelete.then(function (pl) {
                $scope.Message = "User Deleted Successfuly";
                GetAllRecords();
                ClearModels();
            }, function (err) {
                console.log("Some Error Occured." + err);
            });
        }

    }]);

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

    this.getAllStudent = function () {
        return $http.get("http://localhost:52098/HalifaxIISService.svc/GetCreateCurrentAccount");
    }
    //Update the Record  
    this.put = function (Id, User) {
        debugger;
        var request = $http({
            method: "put",
            url: "http://localhost:52098/HalifaxIISService.svc/UpdateCreateCurrentAccount",
            data: User
        });
        return request;
    }

    //Get Single Records  
    this.get = function (Id) {
        return $http.get("http://localhost:52098/HalifaxIISService.svc/GetCreateCurrentAccount/" + Id);
    }

    //Delete the Record  
    this.delete = function (Id) {
        var request = $http({
            method: "delete",
            url: "http://localhost:52098/HalifaxIISService.svc/DeleteCreateCurrentAccount/" + Id
        });
        return request;
    }

})

这是HTML代码。

@{
    Layout = null;
}

<html data-ng-app="WebClientModule">
<head title="ASAS">
    <title></title>
    <script src="~/Scripts/angular.min.js"></script>
    <script src="~/RegistrationScript/EditAccountDetails.js"></script>



</head>
<body>
    <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>
                                <input type="button" id="Edit" value="Edit" data-ng-click="get(user)" />
                            </td>
                            <td>
                                <input type="button" id="Delete" value="Delete" data-ng-click="delete(user)" />
                            </td>
                        </tr>
                    </tbody>
                </table>
            </td>
        </tr>

    </table>
</body>
</html>
<script src="~/RegistrationScript/EditAccountDetails.js"></script>

以下是运行应用程序时的结果。Click here to see the out put

0 个答案:

没有答案