Question

我在角度js中这样做，这有点夸张，但我被卡住了。我是angularjs的新手。我正在做的是发送帖子并进入相同的php页面并使用开关来执行适当的代码。但是当我执行它时，我得到错误：

angular.js:12520 SyntaxError: Unexpected token < in JSON at position 0

我有2个问题，
1.为什么我收到此错误？我做错了什么我已经打开了错误报告，但我没有收到任何错误。为什么呢？

如果你在我的代码中看到一些愚蠢的东西并帮助我做得更好，请原谅我。

AngDemo.html：

<!DOCTYPE html>
<html>
<head>
    <title>AngularJS Demo</title>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js">
    </script>
    <style type="text/css">
    table, th , td  {
                      border: 1px solid grey;
                      border-collapse: collapse;
                      padding: 5px;
                    }
                    table tr:nth-child(odd) {
                      background-color: #f1f1f1;
                    }
                    table tr:nth-child(even) {
                      background-color: #ffffff;
                    }
    </style>
</head>
<body ng-app="demoFile">

<div ng-controller="frmCntrl" ng-init="showTable=false">
<form>
    <p> First Name: &emsp;<input type="text" ng-model="fnameAng" /> </p>
    <p> Last Name: &emsp;<input type="text" ng-model="lnameAng" /> </p>
    <p> Age: &emsp;&emsp;&emsp;&ensp;&nbsp;<input type="number" ng-model="ageAng" /> </p>
    <p> Department: 
        &ensp;&nbsp;<select ng-model="deptAng">
            <option value="">
            <option value="software">Software
            <option value="hr">HR
            <option value="tele-marketing">Tele-Marketing
            <option value="database">Database
        </select>
    </p>
    <input type="submit" value="Submit" data-ng-click="insertData()" />
    <input type="reset" value="Reset" data-ng-click="resetData()" />
</form><br>

<table>
    <thead ng-show="showTable">
        <th>First name</th>
        <th>Last name</th>
        <th>Age</th>
        <th>Department</th>
    <thead>
    <tbody>
        <tr ng-repeat="x in names">
            <td>{{x.fname}}</td>
            <td>{{x.lname}}</td>
            <td>{{x.age}}</td>
            <td>{{x.dept}}</td>         
        </tr>
    </tbody>
</table> 
</div>


</body>
<script>
    var app= angular.module('demoFile', []);

    app.controller('frmCntrl',function($scope,$http){
        $scope.insertData=function(){
            $http.post("addData.php",{
                'fnameAng':$scope.fnameAng,
                'lnameAng':$scope.lnameAng,
                'ageAng':$scope.ageAng,
                'deptAng':$scope.deptAng,
            }).then(function(response){
             console.log("response.data");});

            $scope.showTable=true;

            $http.get("addData.php")
            .then(function(response){
            $scope.names=response.data.records;});
        };
        $scope.resetData=function(){
            $scope.fnameAng="";
            $scope.lnameAng="";
            $scope.ageAng="";
            $scope.deptAng="";
        }   
    });

    /*
    app.controller('tableCntrl',function($scope,$http){
        $http.get("select.php")
        .then(function(response){
        $scope.names=response.data.records;
        })
    });*/

</script>
</html>

addData.php：

<?php
header("Access-Control-Allow-Origin: *");
header("Content-Type: application/json; charset=UTF-8");

ini_set('display_startup_errors',1);
ini_set('display_errors',1);
error_reporting(-1); //Initializing error reporting

$uname="root";//initialzing and connecting to database
$pass="";
$dname="phptut";
mysql_connect("localhost", $uname, $pass);
@mysql_select_db($dname) or die("Cannot open Database");

$method=$_SERVER['REQUEST_METHOD'];//determining the type of request

switch($method)
{
    case 'POST':{
                echo $method;
                $data=json_decode(file_get_contents("php://input"));
                $fname=$data->fnameAng;
                $lname=$data->lnameAng;
                $age=$data->ageAng;
                $dept=$data->deptAng;
                $result = mysql_query("INSERT INTO anginfo (fname, lname, age, dept) VALUES ('$fname','$lname',$age,'$dept')");
                break;
            }

    case 'GET': {
                $result = mysql_query("SELECT fname, lname, age, dept from anginfo");//executing query

                $output=array();//converting the result object to json
                while($r = mysql_fetch_assoc($result)) 
                {
                    $output[] = $r;
                }
                $json=json_encode($output);
                $json='{"records":'.$json.'}';

                echo($json);
            }


}



mysql_free_result($result);
mysql_close();
?>

Answer 1

对于你的第一个问题，听起来你没有给客户json。我不会说PHP，所以我不确定。在您的PHP文件中，您似乎没有在POST语句中定义switch处理程序。基于它说响应中的第一个字符是<的事实，我猜测响应是HTML。如果我尝试确认这一点，我会查看Chrome devtools中的网络标签，查看服务器响应的内容。

对于您的第二个问题... .then上的$http.post来电需要两次回电。第一个是您提供的成功处理程序。第二个是错误处理程序，您尚未提供。您可以尝试添加错误处理程序以查看是否记录任何错误。它应该可以帮助您确认第一个问题...这是您的PHP返回HTML而不是JSON。这是什么样的：

$http.post(function(){
    //your code
}).then(successFunction, errorFunction);

我有一个表单来输入用户详细信息并将其添加到数据库中，并检索这些详细信息并将其显示在表中

1 个答案: