Javascript 使用Angularjs将数据发布到web api时出现问题_Javascript_Angularjs

Javascript 使用Angularjs将数据发布到web api时出现问题

javascript angularjs

Javascript 使用Angularjs将数据发布到web api时出现问题,javascript,angularjs,Javascript,Angularjs,通过重做我创建的应用程序学习Angular。我正在尝试将文本框集合中的一些数据发布到我的生产api中。当我点击submit按钮时，没有收到任何响应。没有闪烁，没有错误信息，什么都没有。我很好奇我的棱角是否连接不好。如果有人能帮我解决这个问题，我将不胜感激 MainController.js (function () { var app = angular.module("app", []) app.controller('MainController', function($scope, $h

通过重做我创建的应用程序学习Angular。我正在尝试将文本框集合中的一些数据发布到我的生产api中。当我点击submit按钮时，没有收到任何响应。没有闪烁，没有错误信息，什么都没有。我很好奇我的棱角是否连接不好。如果有人能帮我解决这个问题，我将不胜感激

MainController.js

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

app.controller('MainController', function($scope, $http) {
    var onUpdatesComplete = function (response) {
        $scope.updates = response.data;
    };
    $http.get("productionApiAddress")
        .then(onUpdatesComplete);

    $scope.demoInquiry = function(){
        var data = $.param({
            json: JSON.stringify({
                firstName : $scope.firstName,
                lastName : $scope.lastName,
                companyName : $scope.companyName,
                email : $scope.email,
                phone : $scope.phone
            })
        });
        $http.post("http://productionApiAddress", data).success(function() {
            $.('#demoSuccessResult').removeClass('hidden');
        })
    };
});
}());

index.html

<html ng-app="app">
...
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-rc.3/angular.min.js"></script>
<script type="text/javascript" src="js/jquery-2.1.1.min.js"></script>
<script type="text/javascript" src="js/MainController.js"></script>
...
<body ng-controller="MainController">
...
<div class="row">
            <div class="col-lg-6 col-xs-12">
                <div class="form-group">
                    <label>First Name*</label>
                    <input type="text" id="txtFirstName" ng-model="firstName" class="form-control" required/>
                </div>
            </div>
            <div class="col-lg-6 col-xs-12">
                <div class="form-group">
                    <label>Last Name*</label>
                    <input type="text" id="txtLastName" ng-model="lastName" class="form-control" required/>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-lg-6 col-xs-12">
                <div class="form-group">
                    <label>Company Name*</label>
                    <input type="text" id="txtCompanyName" ng-model="companyName" class="form-control" required/>
                </div>
            </div>
            <div class="col-lg-6 col-xs-12">
                <div class="form-group">
                    <label>Your Work Email*</label>
                    <input type="text" id="txtEmail" ng-model="email" class="form-control" required/>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-lg-6 col-lg-offset-3 col-xs-12">
                <div class="form-group">
                    <label>Office Phone Number*</label>
                    <input type="text" id="txtPhone" ng-model="phone" class="form-control" required/>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-lg-6 col-lg-offset-3 col-xs-12">
                <div class="form-group">
                    <input type="submit" id="btnDemoSubmit" ng-click="demoInquiry()" class="btn btn-default form-control"
                           style="background-color: #053A54; color: #ffffff;"
                           value="Submit For Trial"/>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-lg-9 col-lg-offset-3 col-xs-12">
                <p>* - required</p>
            </div>
        </div>
        <div class="row">
            <div class="col-lg-9 col-lg-offset-3 col-xs-12 hidden">
                <span id="demoSuccessResult" style="color: blue;">Thank you for registering!</span>
            </div>
        </div>


...
...
...
名字*
姓*
公司名称*
你的工作电子邮件*
办公室电话号码*
*-必需
谢谢您的注册！

请参见下文。您不必使用jquery来显示/隐藏潜水元素，而show-hide将为您完成同样的工作

var-app=angular.module（'app'，[]）；
app.controller（'firstCtrl'，函数（$scope，$http）{
$scope.demoInquiry=函数（）{
风险值数据={
firstName:$scope.firstName，
lastName:$scope.lastName，
companyName:$scope.companyName，
电子邮件：$scope.email，
电话：$scope.phone
};
控制台日志（数据）；
$http.post（“http://productionApiAddress“，数据）。成功（函数（）{
$scope.postSucess=true
}).错误（函数（）{
$scope.postError=true；
});
};
});

名字*
姓*
公司名称*
你的工作电子邮件*
办公室电话号码*
*-必需
谢谢您的注册！
Wooowa不能发帖
在浏览器控制台的“网络”选项卡中启动，检查请求的状态、发送的数据和响应（如果有）。没有真正需要使用$。param
作为angular将默认发送json，该函数在网络中不会显示任何内容。您的输入周围没有表单标记。这看起来对我有用。在做了适当的更改之后，我得到了一个“请求的资源上没有‘访问控制允许来源’”，我可以通过在我的服务上启用CORS来修复这个问题。非常感谢。