Angular 通过 $http.post 写入本地 JSON 文件

最新推荐文章于 2024-10-29 19:22:01 发布

weixin_30339969

最新推荐文章于 2024-10-29 19:22:01 发布

阅读量261

点赞数

CC 4.0 BY-SA版权

文章标签： json javascript java ViewUI

原文链接：http://www.cnblogs.com/sweeeper/p/5822902.html

在使用Angular的$http进行POST操作时，尝试向本地JSON文件插入数据却遇到404错误。解决办法是将文件置于真正的服务器环境中运行。

最近在练习使用 Angular，在实现 $http 对本地 JSON 文档读写的时候遇到了问题。

问题

使用 GET 方法成功将 JSON 文档的内容读出来；但是在使用 POST 插入本地 JSON 文档 newBook 的时候，Chrome 的终端里出现了如下错误：

 Failed to load resource: the server responded with a status of 404 (Not Found)

关键的代码贴出来：

var bookLibraryApp = angular.module('bookLibraryApp', ['ngRoute']);

bookLibraryApp.controller('BookLibraryController', function($scope, $http){ $http.get('api/books.json').success(function(data){ $scope.books = data; }).error(function(){ alert("an unexpected error ocurred!"); }); $scope.addBook = function(){ var newBook = { isbn: $scope.newBook.isbn, title: $scope.newBook.title, year: $scope.newBook.year }; $http.post('api/books.json', newBook).success(function(){ $scope.msg = 'Data saved'; }).error(function(data) { alert("failure message:" + JSON.stringify({data:data})); }); } });

对应的 HTML 文档为：

<div class="container">
    <h2>Create a Book here</h2> <div class="createBookInfo"> <p>ISBN: <input type="text" ng-model="newBook.isbn"/></p> <p>Title: <input type="text" ng-model="newBook.title" /></p> <p>Year: <input type="number" ng-model="newBook.year" /></p> </div> <br /> <button ng-click="addBook()">Insert this book</button> <p>{{msg}}</p> </div>

希望有朋友能够帮忙找下错误在什么地方，谢谢！

默认排序时间排序

3个回答

采纳

在 Angular 官网的 IRC 里得到了帮助，答案（翻译）大概如下：

file:/// 是本地简单的文本服务器，能够实现 $http.get() 的服务，但是要实行POST，PUT，DELETE 的服务，就需要真正的网络服务器了。如果你会多种语言的话，可选的种类有很多种，基于 PHP，Rail，Ruby，Java 等等。
当然可以选择全 JS 的解决方案，比如我现在就在使用 MEAN，祝你玩儿的愉快。