Angular ngResource $save 方法清除 $resource 对象
Angular ngResource $save Method Clears $resource Object
在这里使用 Angular 1.5.5:
有什么方法可以告诉 Angular 忽略特定请求(例如 $save)的响应正文?令我发疯的是,在我调用 $save 之后,angular 使用服务器返回的对象更新模型,该对象最初应该用于区分请求的不同分辨率。它会导致不需要的形式清晰。有趣的是,即使我发送 400 或 500 http 状态代码,这种行为仍然存在。
如果您需要更多信息,相关代码如下。
控制器:
'use strict';
angular
.module('app.operators')
.controller('OperatorNewController', OperatorNewController);
OperatorNewController.$inject = ['operatorsService', 'notify'];
function OperatorNewController(operatorsService, notify) {
var vm = this;
vm.done = done;
activate();
function activate() {
vm.operator = new operatorsService();
}
function done(form) {
if (form.$invalid) {
// do stuff
return false;
}
vm.operator.$save(function(response) {
if (response.success && response._id) {
$state.go('app.operators.details', {id: response._id}, { reload: true });
} else if (response.inactive) {
// do stuff
} else {
// do other stuff
}
}, function (error) {
// do other stuff
});
}
}
服务:
'use strict';
angular
.module('app.operators')
.service('operatorsService', operatorsService);
operatorsService.$inject = ['$resource'];
function operatorsService($resource) {
return $resource('/operators/:id/', {id: '@_id'}, {
'update': { method: 'PUT' }
});
}
服务器请求处理程序也相当简单:
.post('/', function (req, res) {
if (!req.operator.active) {
return res.status(500).json({ inactive: true, success: false });
}
// do stuff
return res.json({ success: true });
});
无论哪种方式,我都不喜欢必须从服务器发送整个对象的想法(尤其是当它是一个失败的请求时),即使我必须这样做,我仍然需要一种方法来发送一些额外的数据将被 Angular.
忽略
非常感谢您的帮助!
资源对象的$save
方法清空并用XHRPOST结果的结果替换对象。为避免这种情况,请使用 operatorsService
:
的 .save
方法
//vm.operator.$save(function(response) {
vm.newOperator = operatorsService.save(vm.operator, function(response),
if (response.success && response._id) {
$state.go('app.operators.details', {id: response._id}, { reload: true });
} else if (response.inactive) {
// do stuff
} else {
// do other stuff
}
}, function (error) {
// do other stuff
});
更新
It results in unwanted form clear. Interestingly enough, this behaviour remains even if I send a 400 or 500 http status code.
此行为未经验证。
我创建了一个 PLNKR 来尝试验证此行为,发现 $save
方法 不会替换 如果服务器 return 是一个资源对象状态为 400 或 500。但是,如果 XHR 状态代码为 200 (OK),它会清空并替换资源对象。
It drives me crazy that after I call $save
, angular updates the model with the object returned by a server
它有助于理解浏览器如何处理来自表单的传统提交。
提交按钮的默认操作使用 method=get
。浏览器将表单输入附加到 URL 作为查询参数,并使用该 URL 执行 HTTP GET 操作。然后浏览器清除 window 或框架并从服务器加载结果。
method=post
的默认操作是序列化输入并将它们放入 HTTP POST 的正文中。然后浏览器清除 window 或框架并从服务器加载结果。
在AngularJS 中,form
指令取消浏览器默认操作并执行由ng-submit
或ng-click
指令设置的Angular 表达式。所有 $resource
实例方法包括 $get
和 $save
,如果 XHR 成功,清空并用服务器的 XHR 结果替换资源对象。这与浏览器处理表单的传统方式一致。
在 RESTful API 中,HTTP GET 操作 return 服务器资源的状态而不更改它。 HTTP POST 操作向服务器添加新的资源状态。 API 通常 return 新资源状态,带有附加信息,如 ID、位置、时间戳等。一些 RESTful API return 重定向(状态 302 或 303),在这种情况下浏览器透明使用新位置执行 HTTP GET。 (这有助于Solve the Double Submission Problem。)
在设计 RESTful API 时,了解传统浏览器的行为方式以及 RESTful 客户端(例如 AngularJS ngResource)的期望非常重要。
在这里使用 Angular 1.5.5:
有什么方法可以告诉 Angular 忽略特定请求(例如 $save)的响应正文?令我发疯的是,在我调用 $save 之后,angular 使用服务器返回的对象更新模型,该对象最初应该用于区分请求的不同分辨率。它会导致不需要的形式清晰。有趣的是,即使我发送 400 或 500 http 状态代码,这种行为仍然存在。
如果您需要更多信息,相关代码如下。
控制器:
'use strict';
angular
.module('app.operators')
.controller('OperatorNewController', OperatorNewController);
OperatorNewController.$inject = ['operatorsService', 'notify'];
function OperatorNewController(operatorsService, notify) {
var vm = this;
vm.done = done;
activate();
function activate() {
vm.operator = new operatorsService();
}
function done(form) {
if (form.$invalid) {
// do stuff
return false;
}
vm.operator.$save(function(response) {
if (response.success && response._id) {
$state.go('app.operators.details', {id: response._id}, { reload: true });
} else if (response.inactive) {
// do stuff
} else {
// do other stuff
}
}, function (error) {
// do other stuff
});
}
}
服务:
'use strict';
angular
.module('app.operators')
.service('operatorsService', operatorsService);
operatorsService.$inject = ['$resource'];
function operatorsService($resource) {
return $resource('/operators/:id/', {id: '@_id'}, {
'update': { method: 'PUT' }
});
}
服务器请求处理程序也相当简单:
.post('/', function (req, res) {
if (!req.operator.active) {
return res.status(500).json({ inactive: true, success: false });
}
// do stuff
return res.json({ success: true });
});
无论哪种方式,我都不喜欢必须从服务器发送整个对象的想法(尤其是当它是一个失败的请求时),即使我必须这样做,我仍然需要一种方法来发送一些额外的数据将被 Angular.
忽略非常感谢您的帮助!
资源对象的$save
方法清空并用XHRPOST结果的结果替换对象。为避免这种情况,请使用 operatorsService
:
.save
方法
//vm.operator.$save(function(response) {
vm.newOperator = operatorsService.save(vm.operator, function(response),
if (response.success && response._id) {
$state.go('app.operators.details', {id: response._id}, { reload: true });
} else if (response.inactive) {
// do stuff
} else {
// do other stuff
}
}, function (error) {
// do other stuff
});
更新
It results in unwanted form clear. Interestingly enough, this behaviour remains even if I send a 400 or 500 http status code.
此行为未经验证。
我创建了一个 PLNKR 来尝试验证此行为,发现 $save
方法 不会替换 如果服务器 return 是一个资源对象状态为 400 或 500。但是,如果 XHR 状态代码为 200 (OK),它会清空并替换资源对象。
It drives me crazy that after I call
$save
, angular updates the model with the object returned by a server
它有助于理解浏览器如何处理来自表单的传统提交。
提交按钮的默认操作使用 method=get
。浏览器将表单输入附加到 URL 作为查询参数,并使用该 URL 执行 HTTP GET 操作。然后浏览器清除 window 或框架并从服务器加载结果。
method=post
的默认操作是序列化输入并将它们放入 HTTP POST 的正文中。然后浏览器清除 window 或框架并从服务器加载结果。
在AngularJS 中,form
指令取消浏览器默认操作并执行由ng-submit
或ng-click
指令设置的Angular 表达式。所有 $resource
实例方法包括 $get
和 $save
,如果 XHR 成功,清空并用服务器的 XHR 结果替换资源对象。这与浏览器处理表单的传统方式一致。
在 RESTful API 中,HTTP GET 操作 return 服务器资源的状态而不更改它。 HTTP POST 操作向服务器添加新的资源状态。 API 通常 return 新资源状态,带有附加信息,如 ID、位置、时间戳等。一些 RESTful API return 重定向(状态 302 或 303),在这种情况下浏览器透明使用新位置执行 HTTP GET。 (这有助于Solve the Double Submission Problem。)
在设计 RESTful API 时,了解传统浏览器的行为方式以及 RESTful 客户端(例如 AngularJS ngResource)的期望非常重要。