可以在$ http.put数据写入JSON文件 [英] Can $http.put write data to JSON file
问题描述
我的新手问题道歉，但我正在逐渐相互矛盾的答案，这一点的同时在网上进行搜索。
I apologize for the newbie question but I am getting conflicting answers to this while searching on the net.
我一直在使用$ http.get创建的AngularJS应用从JSON文件读取并与NG-模型绑定每个表单元素窗体中显示的数据。我非常希望用户能够编辑所需的字段，然后点击保存，再有，在JSON文件更新的数据。我已被告知，要做到这一点，你需要像一个的NodeJS第三方服务器，但是我看到那个展示它的视频正在做其他的例子。谁能告诉我，如果这是可能的，而不第三方服务器，如果这样什么是最好的做法这样做。
I have created an AngularJS app to read from a JSON file using $http.get and display the data as a form with each form element binded with ng-model. Ideally I would like the user to be able to edit the desired field and click save, then have that data updated in the JSON file. I have been told that to do this you will need a 3rd party server like NodeJS, but I am seeing other examples that show it being done in videos. Can someone tell me if this is possible without the 3rd party server and if so what is the best practice for doing this.
感谢您
推荐答案
$ HTTP GET（为位于客户端的资源）将不会在Chrome浏览器中运行，并会给出一个CORS错误（除非你打开关闭Chrome浏览器的Web安全使用运行... /的chrome.exe--allow-文件访问从档案-disable-Web的安全性）。火狐提供了一个错误的说法在JSON没有很好形成，即使它是。浏览器似乎并不喜欢它。
$http GET (for resource located on client) will not work with the Chrome browser and will give a CORS error (unless you disable Chrome web security by opening Chrome using run .../chrome.exe" --allow-file-access-from-files -disable-web-security). Firefox gives an error saying the JSON in not well formed even though it is. Browsers don't seem to like it.
HTML5 localStorage的是客户端的存储要在其中执行CRUD操作，并具有数据活过页面刷新你最好的选择。这方面的一个很好的例子是[TodoMVC示例]
（的https://github.com/tastejs/todomvc/tree/gh-pages/architecture-examples/angularjs)
HTML5 LocalStorage is your best bet for client storage where you wish to perform CRUD operations and have the data survive past page refresh. A good example of this is the [TodoMVC example] (https://github.com/tastejs/todomvc/tree/gh-pages/architecture-examples/angularjs)
这节省了JSON文件localStorage的并读取的localStorage的内容，一个很简单的例子。该服务包含一个getter和setter方法与localStorage的交互。
A very simple example that saves a json file to localstorage and reads the contents of localstorage is shown. The Service contains a getter and a setter method to interact with localstorage.
INDEX.HTML
<body ng-app = "app">
<div ng-controller="MainCtrl">
<form>
<input placeholder="Enter Name.." ng-model="newContact"/>
<button type="submit" class="btn btn-primary btn-lg"
ng-click="addContact(newContact)">Add
</button>
</form>
<div ng-repeat="contact in contacts track by $index">
{{contact.name}}
</div>
</div>
APP.JS
angular.module('app', ['app.services'] )
.controller('MainCtrl', function ($scope, html5LocalStorage) {
//create variable to hold the JSON
var contacts = $scope.contacts = html5LocalStorage.get();
$scope.addContact = function(contact) {
$scope.contacts.push( {"name":contact} ); //Add new value
html5LocalStorage.put($scope.contacts); //save contacts to local storeage
}
});
SERVICES.JS
angular.module('app.services', [] )
.factory('html5LocalStorage', function () {
var STORAGE_ID = 'localStorageWith_nG_KEY'; //the Local storage Key
return {
//Get the localstorage value
get: function ()
{
return JSON.parse(localStorage.getItem(STORAGE_ID) || '[]');
},
//Set the localstorage Value
put: function (values)
{
localStorage.setItem(STORAGE_ID, JSON.stringify(values));
}
};
});
否则，你可以使用节点和Ex preSS和存储在服务器上的JSON文件。使用文件系统模块FS-额外与JSON文件交互。
你将不得不创建RESTful API路线为客户端与服务器使用$ HTTP交互并执行CRUD操作。
Otherwise you could use Node and Express and store the JSON file on the server. Use file system module 'fs-extra' to interact with the json file. You would have to create RESTful API routes for the client to interact with the server using $http and perform CRUD operations.
- /认沽
- /获取
- /删除
- /后
这篇关于可以在$ http.put数据写入JSON文件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
