Angular JS应用程序无法调用WCF Rest服务Post方法

我正在将Wcf服务用于Angular JS应用程序，但它并未按照我的预期工作。我正尝试使用Sql事务处理方法将资金汇入一个帐户。当我点击角度js应用程序中的提交按钮时，它无法将输入值发布到wcf服务。我在控制台应用程序的Google Chrome中检查了它没有显示任何错误，我也检查了网络选项卡，它从输入字段。但问题是值不受WCF服务接收Angular JS应用程序无法调用WCF Rest服务Post方法

这里被命名为资金转移本地类...

{ 
    [DataContract] 
    public class MoneyTransfer 
    { 
     string sender_account_no; 
     string sender_name; 
     string sender_sort_code; 
     string amount1; 
     string transcation_type; 
     string date; 
     string receiver_account_no; 
     string receiver_name; 
     string receiver_sort_code; 
     string amount2; 
     string transcation_type1; 
     string date1; 

     [DataMember] 
     public string Sender_Account_No 
     { 
      get { return sender_account_no; } 
      set { sender_account_no = value; } 


     } 
     [DataMember] 
     public string Sender_Name 
     { 
      get { return sender_name; } 
      set { sender_name = value; } 

     } 
     [DataMember] 
     public string Sender_Sort_Code 
     { 
      get { return sender_sort_code; } 
      set { sender_sort_code = value; } 
     } 
     [DataMember] 
     public string Amount 
     { 
      get { return amount1; } 
      set { amount1 = value; } 
     } 
     [DataMember] 
     public string Transcation_Type 
     { 
      get { return transcation_type; } 
      set { transcation_type = value; } 

     } 
     [DataMember] 
     public string Date 
     { 
      get { return date; } 
      set { date = value; } 


     } 
     [DataMember] 
     public string Receiver_Account_No 
     { 
      get { return receiver_account_no; } 
      set { receiver_account_no = value; } 


     } 
     [DataMember] 
     public string Receiver_Name 
     { 
      get { return receiver_name; } 
      set { receiver_name = value; } 

     } 
     [DataMember] 
     public string Receiver_Sort_Code 
     { 
      get { return receiver_sort_code; } 
      set { receiver_sort_code = value; } 
     } 
     [DataMember] 
     public string Amount1 
     { 
      get { return amount2; } 
      set { amount2 = value; } 
     } 
     [DataMember] 
     public string Transcation_Type1 
     { 
      get { return transcation_type1; } 
      set { transcation_type1 = value; } 

     } 
     [DataMember] 
     public string Date1 
     { 
      get { return date1; } 
      set { date1 = value; } 


     } 

    } 
}

这里是我的接口。

[OperationContract] 
     [WebInvoke(Method = "POST", 
     RequestFormat = WebMessageFormat.Json, 
     ResponseFormat = WebMessageFormat.Json, 
     UriTemplate = "/MoneyTranfer")] 
     bool MoneyTranfer(MoneyTransfer mopneyTransfer);

这是我的实现。

public bool MoneyTranfer(MoneyTransfer mopneyTransfer) 
      { 

       int amount = System.Convert.ToInt32(mopneyTransfer.Amount); 
       int amount1 = System.Convert.ToInt32(mopneyTransfer.Amount1); 

       SqlConnection cn = new SqlConnection(ConnectionString); 
       string sql = "select Account_Balance from Current_Account_Details where Account_Number='" + mopneyTransfer.Sender_Account_No + "'"; 

       SqlCommand cmd = new SqlCommand(sql, cn); 
       if (cn.State == ConnectionState.Closed) 
        cn.Open(); 

       //amount = int.Parse(cmd.ExecuteScalar().ToString()); 

       if (amount > 0) 
       { 
        int b; 
        int b1; 
        SqlCommand cmd1 = new SqlCommand(); 
        SqlTransaction trans; 
        if (cn.State == ConnectionState.Closed) 
         cn.Open(); 
        trans = cn.BeginTransaction(); 

        cmd1.Connection = cn; 
        cmd1.CommandType = CommandType.Text; 
        cmd1.Transaction = trans; 
        cmd1.CommandText = "update Current_Account_Details set Account_Balance=Account_Balance-'" + mopneyTransfer.Amount + "' where Account_Number='" + mopneyTransfer.Sender_Account_No + "'"; 
        b = cmd1.ExecuteNonQuery(); 

        cmd1.CommandText = "update Reward_Account_Details set Account_Balance=Account_Balance+'" + mopneyTransfer.Amount1 + "' where Account_Number='" + mopneyTransfer.Receiver_Account_No + "'"; 
        b1 = cmd1.ExecuteNonQuery(); 
        if (b == 1 && b1 == 1) 
        { 
         trans.Commit(); 
         using (SqlConnection con = new SqlConnection(ConnectionString)) 
         { 
          //Create the SqlCommand object 
          //Create the SqlCommand object 
          SqlCommand cmd3 = new SqlCommand("Current_Account_WITHDRAR", con); 
          //Specify that the SqlCommand is a stored procedure 
          cmd3.CommandType = System.Data.CommandType.StoredProcedure; 

          //Add the input parameters to the command object 
          cmd3.Parameters.AddWithValue("@Account_Number", mopneyTransfer.Sender_Account_No); 
          cmd3.Parameters.AddWithValue("@Account_Holder_Name", mopneyTransfer.Sender_Name); 
          cmd3.Parameters.AddWithValue("@Amount", mopneyTransfer.Amount); 


          cmd3.Parameters.AddWithValue("@Sort_Code", mopneyTransfer.Sender_Sort_Code); 
          cmd3.Parameters.AddWithValue("@Transcation_Type", mopneyTransfer.Transcation_Type); 
          cmd3.Parameters.AddWithValue("@Date", mopneyTransfer.Date); 

          SqlCommand cmd2 = new SqlCommand("Reward_Account_Dposit", con); 
          //Specify that the SqlCommand is a stored procedure 
          cmd2.CommandType = System.Data.CommandType.StoredProcedure; 

          //Add the input parameters to the command object 
          cmd2.Parameters.AddWithValue("@Account_Number", mopneyTransfer.Receiver_Account_No); 
          cmd2.Parameters.AddWithValue("@Account_Holder_Name", mopneyTransfer.Receiver_Name); 
          cmd2.Parameters.AddWithValue("@Amount", mopneyTransfer.Amount1); 


          cmd2.Parameters.AddWithValue("@Sort_Code", mopneyTransfer.Receiver_Sort_Code); 
          cmd2.Parameters.AddWithValue("@Transcation_Type", mopneyTransfer.Transcation_Type1); 
          cmd2.Parameters.AddWithValue("@Date", mopneyTransfer.Date1); 




          //Open the connection and execute the query 

          con.Open(); 
          cmd2.ExecuteNonQuery(); 

          cmd3.ExecuteNonQuery(); 
          return true; 
          //con.Close(); 
         } 

        } 
        else 
         trans.Rollback(); 
        return false; 
       } 
       return false; 

      }

这里是脚本代码。

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



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

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

     $scope.OperType = 1; 

     //1 Mean New Entry 

     //To Clear all input controls. 
     function ClearModels() { 
      $scope.OperType = 1; 

      $scope.Sender_Account_No = ""; 
      $scope.Sender_Name = ""; 
      $scope.Sender_Sort_Code = ""; 
      $scope.Amount = ""; 
      $scope.Transcation_Type = ""; 
      $scope.Date = ""; 

      $scope.Receiver_Account_No = ""; 
      $scope.Receiver_Name = ""; 
      $scope.Receiver_Sort_Code = ""; 
      $scope.Amount1 = ""; 
      $scope.Transcation_Type1 = ""; 
      $scope.Date1 = ""; 

     } 
     $scope.transfer = function() { 
      var User = { 
       Sender_Account_No: $scope.Sender_Account_No, 
       Serder_Name: $scope.Serder_Name, 
       Sender_Sort_Code: $scope.Sender_Sort_Code, 
       Amount: $scope.Amount, 
       Transcation_Type: $scope.Transcation_Type, 
       Date:$scope.Date , 

       Receiver_Account_No: $scope.Receiver_Account_No , 
       Receiver_Name: $scope.Receiver_Name, 
       Receiver_Sort_Code: $scope.Receiver_Sort_Code , 
       Amount1: $scope.Amount1, 
       Transcation_Type1: $scope.Transcation_Type1, 
       Date1:$scope.Date1 

      }; 
      if ($scope.OperType === 1) { 
       var promisePost = myService.post(User); 
       promisePost.then(function (pl) { 
        $scope.Id = pl.data.Id; 
        $scope.msg = "Operation is successful"; 


       }, function (err) { 
        $scope.msg = "Operation is failed !"; 
        console.log("Some error Occured" + err); 
       }); 
      } else { 

      } 

     }; 



    }]); 

app.service("myService", function ($http) { 
    //Create new record 
    this.post = function (User) { 
     var request = $http({ 
      method: "post", 
      url: "http://localhost:52098/HalifaxIISService.svc/MoneyTranfer", 
      data: JSON.stringify(User) 
     }); 
     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/MoneyTransfer.js"></script> 



</head> 
<body> 
    <table id="tblContainer" data-ng-controller="Web_Client_Controller"> 

     <tr> 
      <td> 
       <div style="color: red;">{{msg}}</div> 
       <table style="border: solid 4px Red; padding: 2px;"> 

        <tr> 
         <td></td> 
         <td> 
          <span>Sender Account No</span> 
         </td> 
         <td> 
          <input type="text" id="sender_account_no" data-ng-model="Sender_Account_No" required="" /> 
         </td> 
        </tr> 
        <tr> 
         <td></td> 
         <td> 
          <span>Serder_Name</span> 
         </td> 
         <td> 
          <input type="text" id="serder_name" required data-ng-model="Serder_Name" require="" /> 
         </td> 
        </tr> 
        <tr> 
         <td></td> 
         <td> 
          <span>Sender_Sort_Code</span> 
         </td> 
         <td> 
          <input type="text" id="sender_sort_code" required data-ng-model="Sender_Sort_Code" require="" /> 
         </td> 
        </tr> 

        <tr> 
         <td></td> 
         <td> 
          <span>Amount_to_Send</span> 
         </td> 
         <td> 
          <input type="text" id="amount_to_send" required data-ng-model="Amount" require="" /> 
         </td> 
        </tr> 
        <tr> 
         <td></td> 
         <td> 
          <span>Transcation_Type</span> 
         </td> 
         <td> 
          <input type="text" id="transcation_type" required data-ng-model="Transcation_Type" require="" /> 
         </td> 
        </tr> 
        <tr> 
         <td></td> 
         <td> 
          <span>Date</span> 
         </td> 
         <td> 
          <input type="text" id="date" required data-ng-model="Date" require="" /> 
         </td> 
        </tr> 


        <tr> 
         <td></td> 
         <td> 
          <span>Reciver Account No</span> 
         </td> 
         <td> 
          <input type="text" id="render_account_no" data-ng-model="Reciver_Account_No" required="" /> 
         </td> 
        </tr> 
        <tr> 
         <td></td> 
         <td> 
          <span>Reciver_Name</span> 
         </td> 
         <td> 
          <input type="text" id="reciver_name" required data-ng-model="Reciver_Name" require="" /> 
         </td> 
        </tr> 
        <tr> 
         <td></td> 
         <td> 
          <span>Reciver_Sort_Code</span> 
         </td> 
         <td> 
          <input type="text" id="reciver_sort_code" required data-ng-model="Reciver_Sort_Code" require="" /> 
         </td> 
        </tr> 

        <tr> 
         <td></td> 
         <td> 
          <span>Amount_to_Recived</span> 
         </td> 
         <td> 
          <input type="text" id="amount_to_recive" required data-ng-model="Amount1" require="" /> 
         </td> 
        </tr> 
        <tr> 
         <td></td> 
         <td> 
          <span>Transcation_Type</span> 
         </td> 
         <td> 
          <input type="text" id="transcation_type1" required data-ng-model="Transcation_Type1" require="" /> 
         </td> 
        </tr> 
        <tr> 
         <td></td> 
         <td> 
          <span>Date</span> 
         </td> 
         <td> 
          <input type="text" id="date1" required data-ng-model="Date1" require="" /> 
         </td> 
        </tr> 


        <tr> 
         <td></td> 
         <td></td> 
         <td> 
          <input type="button" id="Createuser" value="Submit" data-ng-click="transfer()" /> 
          <input type="button" id="Clear" value="Clear" data-ng-click="Clear()" /> 
         </td> 
        </tr> 
       </table> 
      </td> 
     </tr> 
    </table> 
</body> 
</html> 

<script src="~/RegistrationScript/MoneyTransfer.js"></script>

下面是关于浏览解析请求PlayLoad价值观..

{"Sender_Account_No":"3","Serder_Name":"rasel khan","Sender_Sort_Code":"11-00-11","Amount":"123900","Transcation_Type":"Withdraw","Date":"11/22/11","Amount1":"123900","Transcation_Type1":"deposit","Date1":"11/22/12"}

下面是截图，当我运行应用程序。。

任何意见或建议都会受到强烈的指责。由于

来源

2017-10-13 Mohammad

更改的WCF服务作为您的接口，

[OperationContract]  
    [WebInvoke(Method = "POST", 
    UriTemplate = "/MoneyTranfer", 
    RequestFormat = WebMessageFormat.Json, 
    ResponseFormat = WebMessageFormat.Json, 
    BodyStyle = WebMessageBodyStyle.Bare)]  
    bool MoneyTranfer(MoneyTransfer mopneyTransfer);

来源

2017-10-16 01:36:57 Sajeetharan

您的要求不包含成功或错误回调

var request = $http({ 
     method: "post", 
     url: :http://localhost:52098/HalifaxIISService.svc/MoneyTranfer", 
     data: JSON.stringify(User) 
});

检查使用的成功和错误回调函数找到确切的错误，

成功和错误回调

$http.get("{url}") 
.success(function(data) { 
    $scope.gists = data; 
}) 
.error(function(data, status) { 
    console.error('Repos error', status, data); 
})

检查回调的

例子Angular js中的功能 https://www.peterbe.com/plog/promises-with-$http

来源

2017-10-13 04:53:15 umasankar

角JS应用程序能够发布的数据服务，但WCF服务不接受它 – Mohammad

你只要它不工作 – Mohammad

@Mohammad HTTPS链接：// WWW .peterbe.com/plog/promises-with- $ http – umasankar

Angular JS应用程序无法调用WCF Rest服务Post方法

回答

相关问题