最近在練習使用 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>
希望有朋友能夠幫忙找下錯誤在什么地方,謝謝!



是的 :D 把文件放在服務器(比如你用到的 http://localhostXXX)里就可以實現了。我之前錯誤是直接操作本地文件(api/books.json)。
KAFFEECKO · 2015年05月29日