服务方法获取404未找到错误

时间:2016-06-14 17:04:19

标签: c# angularjs wcf

我有一个带有WCF的Web API项目。在我的代码中,我有一个名为CreatePerson的方法,它将用户输入的信息添加到SQL数据库中。我遇到的问题是,一旦我加载.aspx页面并点击我的“添加人员”按钮,然后调用一个支持的角度函数,通过$ http.post将该数据发送到CreatePerson方法,我得到开发工具中出现404错误,说它无法找到指定的地址。

这是我的代码:

family1.aspx:

as.character(V1) > '02:00:00'

IService.cs:

 <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Service1.svc.cs" Inherits="WebApplication6.family1" %>

<!DOCTYPE html>
<html>
    <head>
<h2>Family App</h2>
   <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.js"></script>


    </head>

<body ng-app="myApp" ng-controller="familyCtrl">

<form ng-submit="addPerson()">
    <input type="text" ng-model="firstNameInput" size="20" placeholder="First Name" />
    <input type="text" ng-model="lastNameInput" size="20" placeholder="Last Name" />
    <input type="number" ng-model="ageInput" size="20" placeholder="Age" />
    <!--<input type ="number" ng-model="monthInput" stye=20 placeholder="Month" />/
    <input type ="number" ng-model="dayInput" stye=20 placeholder="Day" />/
    <input type ="number" ng-model="yearInput" stye=20 placeholder="Year" />-->
    <input type="submit" value="Add New Person">
</form> 

<br>

<table style ="width:50%">
    <tr><td>Name</td><td>Age</td><td>Remove</td></tr>
        <tr>
        <td>
          <div ng-repeat="per in family"><span ng-bind="per.FirstName"></span>&nbsp;<span ng-bind="per.LastName"></span></div>
             </td>

               <td> <div ng-repeat="per in family"><span ng-bind="per.Age"></span></div>

                </td>

                <td><div ng-repeat="per in family"><input type="checkbox" ng-model="per.IsActive" ></div></td>
            </tr>
        </table>
<p><button ng-click="remove()">Remove marked</button></p>

<script>
var app = angular.module('myApp', []); 
app.controller('familyCtrl', function ($scope, $http) {

    $scope.family = [];

    var parameters = {FirstName : "Joseph", LastName :"Neathery", Age : 19};




    $scope.addPerson = function () {
        $scope.family.push({ FirstName: $scope.firstNameInput, LastName: $scope.lastNameInput, Age: $scope.ageInput, IsActive: false });
        $http.post('/Service1/CreatePerson', parameters);
    }
    $scope.remove = function () {
        var oldFamily = $scope.family;
        $scope.family = [];
        angular.forEach(oldFamily, function (per) {
            if ((!per.IsActive))
                $scope.family.push(per);

        });
    };
});
</script>
    </body>
</html>

Service1.svc.cs:

namespace WebApplication6
{
    // NOTE: You can use the "Rename" command on the "Refactor" menu to change the interface name "IService1" in both code and config file together.
    [ServiceContract]
    public interface IService     
    {

        [WebInvoke(UriTemplate="/Service1/CreatePerson", Method ="POST", RequestFormat =WebMessageFormat.Json)]
        [OperationContract]
        void CreatePerson(Person p);

    }
}

的Web.config:

 public class Service1 : IService
    {

        public void CreatePerson(Person p)
        {

            using (var conn = new SqlConnection(ConfigurationManager.ConnectionStrings["FamilyAppConnectionString"].ConnectionString))
            {
                var command = new SqlCommand("dbo.Person__Create", conn);
                command.CommandType = System.Data.CommandType.StoredProcedure;

                command.Parameters.Add(new SqlParameter("FirstName", p.FirstName));
                command.Parameters.Add(new SqlParameter("LastName", p.LastName));
                command.Parameters.Add(new SqlParameter("Age", p.Age));

                conn.Open();
                command.ExecuteNonQuery();
            }
        }
    }
}

0 个答案:

没有答案