带有 JSON 的 Angularjs，GET 有效，但 POST 无效答案

【问题标题】：Angularjs with JSON, GET works but POST doesn't带有 JSON 的 Angularjs，GET 有效，但 POST 无效
【发布时间】：2014-11-04 18:24:47
【问题描述】：

我对 angularjs 比较陌生。我正在尝试使用一些 JSON，但似乎无法解决我的 post 命令的问题。 get 工作得很好，但其他任何东西都会引发 404 url 错误，尽管我检查过并且一切都匹配。

这是我的 app.js 代码，它调用有效的 get 命令

angular
.module('app', [
    'ui.router'
    ])
.config(['$urlRouterProvider', '$stateProvider', function($urlRouterProvider, $stateProvider){
    $urlRouterProvider.otherwise('/');

    $stateProvider
        .state('home', {
            url: '/',
            templateUrl: 'templates/home.html',
            controller: 'homeCtrl',
            resolve: {
                friends: ['$http', function($http){
                    return $http.get('./api/friends.json').then(function(response ){
                        return response.data;
                    })
                }]
            }
        })
        .state('about', {
            url: '/about',
            templateUrl: 'templates/about.html',
            controller: 'aboutCtrl'
        })
        .state('contact', {
            url: '/contact',
            templateUrl: 'templates/contact.html'
        })
}])

这是加载主页内容的 homeCtrl.js 文件，我想在其中编辑主页的内容并回传到 JSON 文件。

在这里我打电话给帖子，它给了我一个 404 错误。

angular
.module('app')
.controller('homeCtrl', ['$scope', 'friends', '$http', function($scope, friends, $http){
        $scope.title = "Home";
        $scope.friends = friends;
        $scope.items =['item1', 'item2','item3'];
        $scope.selectedValue = 'item1';

        $scope.save = function() {
            $http.post('./api/friends.json', friends);
        };
}]);

这是home.html

<h1>{{title}}</h1>
<ul>
    <li ng-repeat = "friend in friends">
        <input type="text" ng-model="friend.name">
        <input type="text" ng-model="friend.age">
    </li>
</ul>
<button ng-click="save()" class="btn btn-primary">Save</button>

这是friends.json的代码

[
    {"name": "Will", "age": 30},
    {"name": "Laura", "age": 25}
]

【问题讨论】：

听起来您的帖子正在运行。返回 404 的服务器端代码可能有问题。如果您的服务器设置为处理到该端点的帖子？另外，你可能想在这个$http.post('./api/friends.json', friends);中使用$scope.friends
您声明您正试图将您的更改发布回 .json 文件。您需要有一个服务来更新您的 .json 文件。当然，最好将这些数据保存在数据库中。

标签： javascript json angularjs http post

【解决方案1】：

您说“我想编辑主页的内容并回传到 JSON 文件。”

您无法使用 angular 保存到本地文件。 “获取”请求正在工作，只是因为浏览器可以加载静态文件（与 css 或 html 相同）。

您肯定只是通过单击 html 而不是在任何 http-server 中运行应用程序。如果您在文件夹中运行服务器（例如 nodejs http-server）并将浏览器连接到它。它不会提供404（但当然不会更新json文件）

如果您需要保存数据，您需要真正的工作应用程序，该应用程序将提供 API 并处理请求并存储数据。

【讨论】：