Question

我一整天都在尝试和失败。我对这一切都很陌生。这是一个非常简单的angularJS学习练习，我无法弄清楚。

我的GET命令成功提取了JSON数据，但addItem函数中的POST命令没有响应。我相信我错过了服务器配置，但我不知道我会把它放在哪里。

只有两个文件; app和json文件（list.php）;以下两者的内容。此应用目前运行于：

THE APP - index.php：

    <script>

            var app = angular.module("myShoppingList", []); 

            app.controller("myCtrlx", function($scope,$http) {

                $http.get("list.php").then(function (response) {
                    $scope.items = response.data.items;
                });

                $scope.addItem = function () {
                    var data = { "item":$scope.itemInput }                    
                    $http.post("list.php", data).then(function (response) {
                            if (response.data)
                            $scope.msg = "Success!";
                    }, function (response) {
                            $scope.msg = "Didn't Work!";
                    });
                }
            });

    </script>


    <div ng-app="myShoppingList" ng-cloak ng-controller="myCtrlx" class="w3-card-2 w3-margin" style="max-width:400px;">

      <header class="w3-container w3-light-grey w3-padding-16"><h3>List</h3></header>

      <ul class="w3-ul">
            <li ng-repeat="x in items" class="w3-padding-16">{{x.item}}<span ng-click="removeItem($index)" style="cursor:pointer;" class="w3-right w3-margin-right">x</span></li>
      </ul>

      <div class="w3-container w3-light-grey w3-padding-16">
          <div class="w3-row w3-margin-top">
              <div class="w3-col s10">
                  <input placeholder="Add items here" ng-model="itemInput" class="w3-input w3-border w3-padding">
              </div>
              <div class="w3-col s2">
                  <button type="button" value="Submit" ng-click="addItem()" class="w3-btn w3-padding w3-green">Add</button>
              </div>
          </div>
          <p class="w3-text-red">{{errortext}}</p>
      </div>
    </div>

JSON数据库 - list.php：

{
    "items":
    [
    {"item":"peas"},
    {"item":"carrots"},
    {"item":"jam"}
    ]
}

AngularJS将数据插入到JSON文件中

0 个答案: