javascript AngularJS 服务(更新/保存)
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/12043532/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
AngularJS Services (Update/Save)
提问by Logan W
New to AngularJS and trying to get a grasp of the framework, and trying to build a basic CRUD app. I can't seem to figure out what is needed to Update an existing record. Here is my service:
刚接触 AngularJS 并试图掌握框架,并尝试构建一个基本的 CRUD 应用程序。我似乎无法弄清楚更新现有记录需要什么。这是我的服务:
angular.module('appServices', ['ngResource']).
factory('App', function ($resource) {
var Item = $resource('App/:AppId', {
//Default parameters
AppId: '@id'
}, {
//Actions
query: {
method: 'GET',
isArray: true
},
getById: {
method: 'PUT'
},
update: {
method: 'POST'
}
});
return Item;
});
I can run a basic Get all query, and getById to populate an edit form, but that's where I'm stuck. Here is example code for getById
我可以运行一个基本的 Get all 查询,并使用 getById 来填充一个编辑表单,但这就是我被卡住的地方。这是 getById 的示例代码
$scope.apps = App.query();
$scope.getEdit = function(AppId) {
App.getById({id:AppId}, function(app) {
$scope.original = app;
$scope.app = new App(app);
});
};
$scope.save = function() {
//What type of information should go here?
//Do I need to make changes to the appServices?
};
I guess, I'm just not sure what's next concerning Updating existing information, or how the "app" object gets passed to the API, can anyone point me in the right direction, or show me a quick update method?
我想,我只是不确定关于更新现有信息的下一步是什么,或者“应用程序”对象如何传递给 API,有人能指出我正确的方向,或者告诉我快速更新方法吗?
回答by Oddman
This is a really messy way of handling save operations in angular. For one - you should not be using PUT operations for retrieval requests and secondly - all of this is already built-in to angular. See below.
这是处理角度保存操作的一种非常混乱的方式。一方面 - 您不应该使用 PUT 操作来检索请求,其次 - 所有这些都已经内置到 angular 中。见下文。
var Item = $resource( 'App/Details/:AppId', { AppId: '@id' } );
var item = Item.get({ id: 1 }, function( data ) {
data.setAnothervalue = 'fake value';
data.$save();
);
What I'm doing here is retrieving an "Item" and then immediately saving it with new data once it's returned.
我在这里做的是检索“项目”,然后在返回后立即用新数据保存它。
Angular JS provides a stack of defaults already, including query, save, remove/delete, get.etc. And for most RESTful APIs, you really shouldn't need to add much, if anything at all. See the resource docs for more information, particularly the information on defaults: http://docs.angularjs.org/api/ngResource.$resource
Angular JS 已经提供了一堆默认值,包括查询、保存、删除/删除、获取等。对于大多数 RESTful API,您真的不需要添加太多,如果有的话。有关更多信息,尤其是有关默认值的信息,请参阅资源文档:http: //docs.angularjs.org/api/ngResource.$resource
Additionally, once you get a handle on that - you may want to use $save for both create/update operations, but using POST/PUT (RESTful conventions). If you do, see my article that I wrote about not too long ago: http://kirkbushell.me/angular-js-using-ng-resource-in-a-more-restful-manner/
此外,一旦您掌握了这一点 - 您可能希望将 $save 用于创建/更新操作,但使用 POST/PUT(RESTful 约定)。如果你这样做,请参阅我不久前写的文章:http: //kirkbushell.me/angular-js-using-ng-resource-in-a-more-restful-manner/
回答by Logan W
After doing a bit more research, and reviewing Daniel's link (thanks). I got it working.
在进行了更多研究并查看了 Daniel 的链接之后(谢谢)。我让它工作了。
Controller method:
控制器方法:
$scope.save = function() {
$scope.app.update();
};
Service Factory:
服务工厂:
var Item = $resource('App/Details/:AppId', {
//Default parameters
AppId: '@id'
}, {
//Actions
query: {
method: 'GET',
isArray: true
},
getById: {
method: 'PUT'
},
update: {
method: 'POST'
}
});
Item.prototype.update = function (cb) {
console.log(this.AppId);
return Item.update({ AppId: this.AppId },
angular.extend({}, this, { AppId: undefined }), cb);
};
return Item;