Question

我正在尝试使用AngularJS中的下拉输入字段和提交按钮创建一个表单。除了输出为空xD外，一切正常。我正在使用<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.2/angular.min.js"></script>。如果它在服务器端有任何帮助，我使用的是PHP Version 5.5.36-1+donate.sury.org~trusty+1。

这是角色代码：

        var app = angular.module('plunker', []);

        app.controller('MainCtrl', function($scope, $http) {
            $scope.myTxt = "You have not clicked submit, yet!";
            $scope.show_result = false;

            $scope.myFunc = function() {
                $scope.myTxt = "You clicked submit!";
                $scope.show_result = true;
            }

            $scope.categories = [
                {"value": 0, "categoryname": "standard"},
                {"value": 1, "categoryname": "premium"},
                {"value": 2, "categoryname": "gold"}
            ];

            $scope.submitData = function() {
                $scope.category = {};
                console.log($scope.category);
                var jsonString = JSON.stringify($scope.category);
                $http.post('ServerController.php', jsonString, {'Content-Type': 'application/x-www-form-urlencoded'})
                        .success(function(data, status) {
                            $scope.status = status;
                            $scope.data = data;
                        });
            }
        });

这是ServerController.php：

$jsonString = file_get_contents('php://input');
        $form_data = json_decode($jsonString, true);
        if ($form_data != null) {
            echo 'Success!!!';
            var_dump($form_data);
        } else {
            echo 'Sorry!!!';
            var_dump($form_data);
        }

这是HTML：

<body ng-app="plunker">    
                <form ng-submit="myFunc()" ng-controller="MainCtrl">
                    <label><b>Category:</b></label>
                    <select ng-model="category" ng-options="x.categoryname for x in categories track by x.value">
                        <option value="">Choose a Category</option>
                    </select>
                    <p><b>Model:</b> {{category}}</p>
                    <input ng-click="submitData()" type="submit" value="Submit"></input>
                    <i>{{myTxt}}</i>
                    <p ng-show="show_result"><b>Submitted result:</b> {{data}}</p>
                </form>
            </body>

以下是表单在页面加载上的显示方式：

这是在下拉列表中选择类别之后：

最后点击提交后：

注意：服务器控制器正在提交结果即发送输出。 Sorry!!!<pre class='xdebug-var-dump' dir='ltr'> <b>array</b> <i>(size=0)</i> <i><font color='#888a85'>empty</font></i> </pre>

有什么想法吗？

$ http.post（）不起作用 - （AngularJS）

0 个答案: