![](/img/trans.png)
[英]How to pass the nested service and get the response from angular factory to controller
[英]Angular JS : How to pass the Response from a service to controller?
我嘗試從控制器中的服務處理成功/錯誤處理。
我已經試過了:
服務內容:
.factory('AuthenticationService',
['Base64', '$http', '$cookieStore', '$rootScope',
function (Base64, $http, $cookieStore, $rootScope) {
var service = {};
service.Login = function (username, password, callback) {
var authdata = Base64.encode(username + ':' + password);
$rootScope.globals = {
currentUser: {
username: username,
authdata: authdata
}
};
$http.defaults.headers.common['Authorization'] = 'Basic ' + authdata;
$cookieStore.put('globals', $rootScope.globals);
$http.post('http://localhost:8080/v1/login', { username: username, password: password })
.success(function (response) {
callback(response);
});
};
service.ClearCredentials = function () {
$rootScope.globals = {};
$cookieStore.remove('globals');
$http.defaults.headers.common.Authorization = 'Basic ';
};
return service;
}])
和控制器:
.controller('LoginController',
['$scope', '$rootScope', '$location', 'AuthenticationService',
function ($scope, $rootScope, $location, AuthenticationService) {
// reset login status
AuthenticationService.ClearCredentials();
$scope.login = function () {
$scope.dataLoading = true;
AuthenticationService.Login($scope.username, $scope.password, function (response) {
if(response.success) {
$location.path('/');
} else {
$scope.error= response.message;
$scope.dataLoading = false;
}
});
};
}]);
如果我嘗試使用警報,它將僅顯示在服務中,而不顯示在控制器中。
試試這個
.factory('AuthenticationService',
['Base64', '$http', '$cookieStore', '$rootScope',
function (Base64, $http, $cookieStore, $rootScope) {
var service = {};
this.Login = function (username, password) {
var authdata = Base64.encode(username + ':' + password);
$rootScope.globals = {
currentUser: {
username: username,
authdata: authdata
}
};
$http.defaults.headers.common['Authorization'] = 'Basic ' + authdata;
$cookieStore.put('globals', $rootScope.globals);
$http.post('http://localhost:8080/v1/login', { username: username, password: password })
.success(function (response) {
return response;
});
};
this.ClearCredentials = function () {
$rootScope.globals = {};
$cookieStore.remove('globals');
$http.defaults.headers.common.Authorization = 'Basic ';
};
}])
調節器
.controller('LoginController',
['$scope', '$rootScope', '$location', 'AuthenticationService',
function ($scope, $rootScope, $location, AuthenticationService) {
// reset login status
AuthenticationService.ClearCredentials();
$scope.login = function () {
$scope.dataLoading = true;
var response = AuthenticationService.Login($scope.username, $scope.password);
if(response.success) {
$location.path('/');
} else {
$scope.error= response.message;
$scope.dataLoading = false;
}
};
}]);
使用諾言:
.factory('AuthenticationService',
['Base64', '$http', '$cookieStore', '$rootScope', '$q',
function (Base64, $http, $cookieStore, $rootScope, $q) {
var service = {};
service.Login = function (username, password, callback) {
var deferred = $q.defer();
var authdata = Base64.encode(username + ':' + password);
$rootScope.globals = {
currentUser: {
username: username,
authdata: authdata
}
};
$http.defaults.headers.common['Authorization'] = 'Basic ' + authdata;
$cookieStore.put('globals', $rootScope.globals);
$http.post('http://localhost:8080/v1/login', { username: username, password: password })
.then(function (response) {
deferred.resolve(response);
}, function(error) {
deferred.reject(error);
});
return deferred.promise;
};
service.ClearCredentials = function () {
$rootScope.globals = {};
$cookieStore.remove('globals');
$http.defaults.headers.common.Authorization = 'Basic ';
};
return service;
}])
還有你的控制器
.controller('LoginController',
['$scope', '$rootScope', '$location', 'AuthenticationService',
function ($scope, $rootScope, $location, AuthenticationService) {
// reset login status
AuthenticationService.ClearCredentials();
$scope.login = function () {
$scope.dataLoading = true;
AuthenticationService.Login($scope.username, $scope.password)
.then(function(success) {
$location.path('/');
}, function(error) {
$scope.error= response.message;
$scope.dataLoading = false;
});
};
}]);
無需使用$q.defer()
來制造諾言,因為$ http服務已經返回了諾言。 避免使用此Q Defer Anti-Pattern 。
//AVOID this $q.defer ANTI-PATTERN
var deferred = $q.defer();
$http.post('http://localhost:8080/v1/login', { username: username, password: password })
.then(function (response) {
deferred.resolve(response);
}, function(error) {
deferred.reject(error);
});
return deferred.promise;
而是簡單地使用$ http服務返回的承諾:
//INSTEAD return promise from $http
var promise = $http.post('http://localhost:8080/v1/login', { username: username, password: password });
return promise;
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.