【发布时间】：2015-05-20 23:53:51
【问题描述】：
我正在与您联系以获得有关 AngularJS 的 $promise 问题的帮助。
这里是关于 $resource 的文档信息，它也适用于 $http
话虽如此，我正在尝试进行 API 调用，并在成功时想要执行回调操作。由于操作是异步进行的，因此甚至在 API 调用完成之前就会发生回调操作。这会导致不正确的数据反射。这是使用 $resource 和 $http 的简单 get 示例。在这两种情况下，实际期望是控制台日志应该显示实际数据，但它会显示承诺数据并导致回调函数甚至在 API 调用完成之前就被调用
$http.get('../../../Employee/GetEmployees').success(function (data) {
console.log(data);
});
return $resource('../../../Employee/GetEmployees', {},
{
query: { method: 'GET', isArray: true },
});
我提供的示例只是为了提供清晰的图片，但我的实际问题来自“PUT”（更新）。按照逻辑，更新必须首先通过 API 调用进行，然后页面需要重定向到 List 页面，在该页面将查询和呈现更新的数据。对此的任何建议将不胜感激。
$scope.UpdateEmp = function () {
var empl = $scope.Employee;
empFactory.empUpdate.update({ EmpID: $routeParams.EmpID, empval: empl }).$promise.then(function () { // update method in my resource uses $resource
$location.path('/EmpList'); //redirect to list
});
P.S: 暂时请留下URL，请将其可视化为返回JSON对象的API。
这是完整的代码
这是完整的代码。
路由：
var myApp = angular.module('myApp', ['emp', 'ngRoute']);
myApp.config(function ($routeProvider) {
$routeProvider
.when('/',
{
templateUrl: 'pages/EmpList.html',
controller: 'empController'
}
)
.when('/EmpDetail/:EmpID',
{
templateUrl: 'pages/EmpDetail.html',
controller: 'empDetailController'
}
)
.when('/EmpList',
{
templateUrl: 'pages/EmpList.html',
controller: 'empController'
}
)
.when('/EmpCreate',
{
templateUrl: 'pages/EmpCreate.html',
controller: 'empCreateController'
});
});
这里是控制器方法
myApp.controller('empController', function ($scope, $routeParams, $location, empFactories, empFactory, $http, empHttpFactory) {
$scope.Employees = empFactories.query();
$scope.edit = function (EmpID) {
$location.path('/EmpDetail/' + EmpID);
};
$scope.Delete = function (empID) {
empFactory.empDelete.del({ EmpID: empID }, function () {
$location.path('/EmpList');
});
}
$scope.Createnew = function () {
$location.path('/EmpCreate');
}
});
myApp.controller('empDetailController', function ($scope, empFactory,empFactories, $routeParams, $location) {
$scope.Employee = empFactory.employee.show({ EmpID: $routeParams.EmpID });
console.log($scope.Employee);
$scope.UpdateEmp = function () {
var empl = $scope.Employee;
empFactory.empUpdate.update({ EmpID: $routeParams.EmpID, empval: empl }).$promise.then(function () { // update method in my resource uses $resource
$location.path('/EmpList'); //redirect to list
});
};
});
Here is the service
var myservice = angular.module('emp', ['ngResource', 'ngRoute']);
myservice.factory('empFactories', function ($resource) {
return $resource('../../../Employee/GetEmployees', {},
{
query: { method: 'GET', isArray: true },
create: { method: 'POST' }
});
});
myservice.factory('empFactory', function ($resource) {
//return $resource('../../Employee/GetEmployee/:EmpID', { EmpID: '@EmpID' },
// {
// show: { method: 'GET' }
// });
var resource = {
employee:
$resource('../../Employee/GetEmployee/:EmpID', { EmpID: '@EmpID' },
{
show: { method: 'GET' }
}),
empUpdate:
$resource('../../Employee/PutEmployee/:EmpID', { EmpID: '@EmpID', empval: '@empl' }, { update: { method: 'PUT', isArray: true } }),
empDelete:
$resource('../../Employee/DeleteEmployee/:EmpID', { EmpID: '@EmpID' }, { del: { method: 'DELETE', isArray: true } }),
empCreate:
$resource('../../Employee/CreateEmployee', { empval: '@empl' }, { create: { method: 'POST', isArray: true } })
}
return resource;
});
【问题讨论】：
-
您能否发布完整代码或检查来自开发人员工具的请求和响应？我发现在收到响应之前成功运行很奇怪。
-
对于 get 方法，我正在检查开发人员工具控制台日志。对于 Put 方法，正如我所说，期望是“重定向应该在更新后进行”。我对 Put 使用了类似的 onsuccess 条件，正如您在我的示例中看到的那样
-
我知道您正在努力使问题保持简洁，但我无法理解
$http调用与return $resource()的关系 - 这些只是您 API 中的替代方案吗？以及两者与UpdateEmp函数中的调用有何关系 -
我在下面的答案部分发布了完整的代码。例如，我比较了 $http 和 $resource。我只使用 $resource 。只是为了确保我不应该将 cmets 作为 ，在 $http 中不会出现此问题，我分享了示例。
标签： angularjs angularjs-resource