ngResource 查询，获取并保存

Question

我正在学习 ngResource。

我可以“获取” json 文件的所有值。但我不能使用一个值（使用查询）并更新其他值。

我明白了：

this.total = userService.query();

我正在尝试购买：

this.user = userService.query({"name":"Luis"});

我正在尝试更新：

var userToUpdate = userService.get({},{"name":"Luis"});
userToUpdate.name = "Name changed";
userToUpdate.$save();

现在是通用代码

file1.html

<div ng-app="module" ng-controller="controls as ctrl">
<div ng-repeat="item in ctrl.total">
<span ng-bind="item.name"></span>
</div>

{{ ctrl.total }}

<br /><br />

{{ ctrl.user }}


</div>

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-resource.js"></script>

<script>
var x = angular.module("module", ["ngResource"]);


x.factory("userService", ["$resource", function($resource)
{
return $resource("data.json");
}]);


x.controller("controls", ["userService", function(userService)
{

this.total = userService.query();

this.user = userService.query({"name":"Luis"});

var userToUpdate = userService.get({},{"name":"Luis"});
userToUpdate.name = "Name changed";
userToUpdate.$save();

}]);

</script>

data.json

[
{"id": 1, "name": "Mario", "lastname": "Perez"},
{"id": 2, "name": "Raul", "lastname": "Alvarez"},
{"id": 3, "name": "Pedro", "lastname": "Tomas"},
{"id": 4, "name": "Luis", "lastname": "Ranks"}

]

有人可以帮助我吗？我是新手。 感谢您的宝贵时间。

Answer 1

你错过了对什么是 json 文件的理解

JSON 是一种存储数据的格式。您可以将 静态 数据存储在 *.json 文件中。所以你的 data.json 文件中的数据是静态的，它只是一些数据的静态存储。

因此，当您使用任何查询参数执行userService.get() 时，您每次都会得到相同的响应。你只是得到静态数据。尽管有查询参数，此数据仍将返回

又一次。 *.json 只是静态数据存储。你不能用userService.$save() 方法更新它。您将获得与响应相同的静态数据。

要更新某些内容，您需要一些 服务 来更新您的数据。例如，您有一些后端，正在更新 data.json。

所以，正常情况是：

1. 您有处理前端请求的后端
2. 前端会发出一些请求，例如 GET /data 或 PUT /data/$id（更新数据）或 POST /data（添加数据）。
3. 后端将实现这些方法

前端代码应该是：

var module = angular.module('myApp', []);
module.factory('userService', ['$resource', function ($resource) {
    return $resource('/api/data/:id');
}]);
module.controller('myCtrl', ['$http', function ($http) {
  userService.get(); // GET /api/data request will be performed
  userService.put({id: 1}); // PUT /api/data/1 request will be performed
  userService.post({name: 'someName'}); // POST /api/data will be performed
}]);

我不会提供后端代码。它会在你的情况下操作 *.json 文件。