AngularJS不通過POST發送數據

Question

我正在嘗試通過AngularJS $ http.post將某些表單數據保存到JSON，但是不起作用。 這個想法很簡單：我有一個包含三個字段的表單，一個AngularJS數據綁定和一個非常簡單的PHP代碼，將其保存到文件中。 由於PHP文件顯然未獲得任何輸入，因此它不起作用，因此它始終存儲null 。

這是代碼：

HTML表單：

<form class="form-horizontal">
    <div class="form-group">
        <label for="title" class="col-sm-2 control-label">Title:</label>
        <div class="col-md-4">
            <input type="text" class="form-control" id="title" ng-model="book.title" placeholder="Title">
        </div>
    </div>
    <div class="form-group">
        <label for="pages" class="col-sm-2 control-label">Pages:</label>
        <div class="col-md-1">
            <input type="number" class="form-control input-sm" id="pages" ng-model="book.pages" placeholder="0">
        </div>
    </div>
    <div class="form-group">
        <label for="readPages" class="col-sm-2 control-label">Read pages:</label>
        <div class="col-md-1">
            <input type="number" class="form-control input-sm" id="readPages" ng-model="book.readPages" placeholder="0">
        </div>
    </div>
    <button class="btn btn-primary glyphicon glyphicon-floppy-save" ng-click="save()"></button>
</form>

JS代碼：

angular.module('book', [
    'ui.router'
])
    .config(function config($stateProvider) {
        $stateProvider.state('book', {
            url: '/book',
            views: {
                "main": {
                    controller: 'Book',
                    templateUrl: 'ui/views/book.tpl.html'
                },
                "header": {
                    templateUrl: 'ui/views/header.tpl.html'
                },
                "footer": {
                    templateUrl: 'ui/views/footer.tpl.html'
                }
            },
            data: {pageTitle: 'Book Status'}
        });
    })

    .controller('Book',
    function ($scope, $http) {
        $scope.book = {};
        $scope.error = "";

        $scope.save = function() {
            console.log($scope.book);
            $http.post('save/book.php', $scope.book).then(function(response) {
                // log success
                console.log("Guardado con éxito.");
                console.log(response);
              });
        };
});

和PHP代碼：

$data = file_get_contents("php://input");
$inp = file_get_contents('../data/books.json');

$tempArray = json_decode($inp);
$tempData = json_decode($data);
array_push($tempArray, $tempData);
$jsonData = json_encode($tempArray);
$file = fopen('../data/books.json','w+');
fwrite($file, $jsonData);
fclose($file);
echo $jsonData;

因此，顯然一切都正確，但是我得到了以下響應：

（！）警告：array_push（）期望參數1為數組，在第7行的C：\\ wamp \\ www \\ angulardemos \\ save \\ book.php中給出null

這告訴我輸入不正確，因此我實際上沒有發送任何數據。 我想念什么？

Answer 1

easy $tempArray為null添加var_dump對其進行調試

$tempArray = $tempArray = json_decode($inp, true);
$tempData = json_decode($data);
array_push($tempArray, $tempData);

您也可以嘗試：

$tempArray[]=$tempData;

Answer 2

從ng-model中刪除書籍，並將其<input type="text" class="form-control" id="title" ng-model="title" placeholder="Title">

同樣適用於所有..，並在保存函數中var dataObj = { title: $scope.title, pages: $scope.pages
} var dataObj = { title: $scope.title, pages: $scope.pages
} var dataObj = { title: $scope.title, pages: $scope.pages
} var res = $http.post('save/book.php', JSON.stringify(dataObj)