我如何从控制台testingAngularJS服务？

我有一个像这样的服务：

angular.module('app').factory('ExampleService', function(){ this.f1 = function(world){ return 'Hello '+world; } return this; }) 

我想从JavaScript控制台testing它并调用服务的函数f1() 。

我怎样才能做到这一点？

Answer 1

所以我发现，如果已经存在一个注入器，你不能简单地调用angular.injector(['app']) 。 因为这个函数试图创build一个新的注入器。

相反，你必须调用injector = angular.element(document.body).injector()

从检索到的injector您可以使用injector.get('ServiceName')获得任何您喜欢injector.get('ServiceName')

所以在一行中 ，命令将如下所示：

 angular.element(document.body).injector().get('serviceName') 

在这个答案更多的信息： 不能从angular度检索注射器
甚至更多： 在传统代码中调用Angular JS

---

另一个有用的技巧来获得特定元素的$scope 。 使用开发人员工具的DOM检查工具select元素，然后运行以下行（ $0始终是选定的元素）：
angular.element($0).scope()

Answer 2

首先，您的服务的修改版本。

一个 ）

 var app = angular.module('app',[]); app.factory('ExampleService',function(){ return { f1 : function(world){ return 'Hello' + world; } }; }); 

这返回一个对象，这里没有新的东西。

现在从控制台得到这个的方式是

b）

 var $inj = angular.injector(['app']); var serv = $inj.get('ExampleService'); serv.f1("World"); 

C ）

你之前在那里做的一件事是假设app.factory返回你自己的函数或者它的一个新版本。 事实并非如此。 为了得到一个构造函数，你要么必须这样做

 app.factory('ExampleService',function(){ return function(){ this.f1 = function(world){ return 'Hello' + world; } }; }); 

这将返回一个ExampleService构造函数，您将接下来必须执行“新build”。

或者，

 app.service('ExampleService',function(){ this.f1 = function(world){ return 'Hello' + world; }; }); 

这将在注入时返回新的ExampleService（）。

Answer 3

@ JustGoscha的答案是现货，但是当我想要访问的时候需要input很多东西，所以我把它添加到我的app.js的底部。 然后，我必须input的是x = getSrv('$http')来获取http服务。

 // @if DEBUG function getSrv(name, element) { element = element || '*[ng-app]'; return angular.element(element).injector().get(name); } // @endif 

它将其添加到全局范围，但仅在debugging模式下。 我把它放在@if DEBUG里面，这样我就不会在生产代码中find它了。 我使用这种方法从prouduction构build中删除debugging代码。