简体繁体 English

从控制台访问角度控制器（Chrome 或 Firefox）

[英]Accessing an angular controller from the console (Chrome or Firefox)

原文 2017-05-07 14:50:19 1 2 javascript/ angularjs/ google-chrome/ controller

I have attached a picture of the click action I want to run from the Chrome console, with various values passed.我附上了一张我想从 Chrome 控制台运行的点击操作的图片，并传递了各种值。 The button is highlighted in gray top right in the inspect element.该按钮在检查元素的右上角以灰色突出显示。 It is the savePublish() function I want to learn how to access/use.这是我想学习如何访问/使用的savePublish()函数。

The button element is inside a <div ng-controller="ProductEditCtrl as ctrl" .. > container, but of course there are other controller wrappers on the page aliased as ctrl按钮元素位于<div ng-controller="ProductEditCtrl as ctrl" .. >容器内，但当然页面上还有其他控制器包装器，别名为ctrl

My question is, how do I access the savePublish() method directly from the Chrome console?我的问题是，如何直接从 Chrome 控制台访问savePublish()方法？ And a bonus question-answer would be, how would I load the ProductEditCtrl controller and then call the savePublish method on a different page?一个额外的问题答案是，我将如何加载ProductEditCtrl控制器，然后在不同的页面上调用 savePublish 方法？

2 个解决方案

尝试使用angular.element($0).scope()来检查按钮的scope ，或者像ng-inspector一样使用Chrome扩展。

You can find a controller via chrome console, via the elements class name by using angular.element.您可以使用 angular.element 通过元素类名称通过 chrome 控制台找到控制器。 EG:例如：

angular.element(document.querySelector(".btn.btn-primary")).controller()

Associated methods/functions will be returned, if they are available on that element.如果在该元素上可用，则将返回关联的方法/函数。