Question

我从JSON文件中获得了一些数据，我在HTML中使用它首先从AngularJS获取它，如下所示：

$http.get('js/data.json').success(function(data) {
    $scope.data = data;
});

我想在点击HTML中的按钮后更新此JSON文件：

<button ng-click="postData(id)">Post</button>

Answer 1

您不能仅通过JavaScript（AngularJS）在文件上书写。

您将通过服务器端指向＆＃34; post＆＃34;请求服务器端脚本（即：PHP）并使该脚本完成工作。

Answer 2

这种事情是行不通的。您尝试写入的文件将位于服务器上;就像现在一样，它将是一个静态资源。我建议阅读Angular资源，here。您可以设置服务器端代码以对json文件执行CRUD操作，但实际上数据库最好。如果您更喜欢使用json格式，Mongodb是您的最佳选择; here是Mongodb大学的链接，提供免费课程。我过去做过，而且很棒。

现在，对于一些实际帮助您的情况：您可以在json文件上执行GET请求，因为它被视为静态资源。但是，POST请求需要服务器端脚本来执行任何操作。

$http.get('api/YOUR_RESOURCE').success(function(data) {
  $scope.database = data;
});

$http.post('api/YOUR_RESOURCE', {
  data_key: data_value, 
  data_key2: data_value2
}).success(function(data) { 
  data[id].available = false; 
});

在学习Angular的过程中，这可能会更进一步，但这里有一段Node.js服务器代码，有一个Mongo数据库和Mongoose来处理'Schema'，以帮助你了解它是如何工作的：

var mongoose = require('mongoose'),
YOUR_RESOURCE = mongoose.model('YOUR_RESOURCE');

app.route('/api/YOUR_RESOURCE')
  // This should be your GET request; 'api/
  .get(
    // Get all docs in resource
    YOUR_RESOURCE.find().exec(function (err, data) {
      if (err) {
        return res.status(400).send({
          message: SOME_ERROR_HANDLER
        });
      } else {
        res.json(data); // return list of all docs found
      }
    });)
  // Add new doc to database
  .post(function (req, res) {
    // The keys of the object sent from your Angular app should match
    // those of the model
    var your_resource = new YOUR_RESOURCE(req.body);

    your_resource.save(function (err) {
      if (err) {
        return res.status(400).send({
          message: SOME_ERROR_HANDLER
        });
      } else {
        // returns newly created doc to Angular after successful save
        res.json(your_resource);
      }
    });
  );

Here是一个SO页面，其中包含有关Node入门的资源列表;我推荐Node，因为它易于使用，而且它是用JS编写的。 Mongo大学课程还会设置您的服务器以便与数据库一起使用;您可以选择多种方式，例如Java，.NET，Python或Node。

上面的示例中有一点遗漏，例如Mongoose模型和节点设置，但如果您选择阅读它们，那么我将在页面上链接的资源中介绍这些内容。希望这会有所帮助：）

更新AngularJS中的JSON文件

2 个答案: