控制器无法调用自定义GitHub服务,请求排查错误原因
解决控制器无法读取GitHub服务及
Cannot read property 'then' of undefined错误 我看了你的代码,问题出在github.js服务的getUser方法没有返回Promise对象,导致控制器调用github.getUser()后拿到的是undefined,自然没法调用.then()方法。
修复步骤:
修改github.js服务,确保
getUser返回$http请求的Promise
你的原服务代码里,$http.get前面缺少了return关键字,这就导致方法执行完没有返回值。修复后的代码应该是这样:(function() { var github = function($http) { var getUser = function(username) { // 关键:这里要return $http的请求结果(Promise对象) return $http.get('https://api.github.com/users/' + username) .then(function(response) { return response.data; }); }; return { getUser: getUser }; }; // 确保服务注册到你的Angular模块(这里是githubViewer) var module = angular.module('githubViewer'); module.factory('github', github); })();验证控制器调用逻辑
你的控制器里的searchFn方法逻辑是对的,只要服务返回了Promise,就能正常链式调用.then():$scope.searchFn = function() { github.getUser($scope.username) .then(function(data) { $scope.user = data; // 后续如果要调用repos_url的话,这里可以继续处理 }, function(error) { $scope.error = error; }); };
为什么这样修复?
Angular的$http.get()方法本身会返回一个Promise对象,服务的getUser方法需要把这个Promise传递给控制器,这样控制器才能通过.then()来处理异步请求的成功或失败回调。如果没有return,方法默认返回undefined,就会触发你看到的那个错误。
另外还要确认你的服务已经正确注册到了对应的Angular模块(githubViewer),这一步在上面的修复代码里已经包含了,确保模块能找到这个服务。
内容的提问来源于stack exchange,提问作者Rahul
相关产品推荐
相关产品推荐

