有没有办法重新定义绑定到AngularJS之外$ctrl的函数?

Question

在我的DOM中，我有这个元素，其中包含绑定到我网站的徽标ng-click="$ctrl.goToHome()。该元素是由AngularJS制作的第三方应用程序创建的。请参阅下面的完整元素：

<img ng-if="::!$ctrl.config.url" ng-click="$ctrl.goToHome()" class="ct-logo" ng-src="https://www.example.com/wp-content/themes/mytheme/logo.png" alt="" src="https://www.example.com/wp-content/themes/mytheme/logo.png">

但是，此函数不起作用可能是因为未定义该函数。我不确定在哪里定义它。有没有办法重新定义goToHome((函数？换句话说，是否可以使用 jQuery 或 JS 重新绑定函数？如果是这样，最简单的方法是什么？

Answer 1

所以基本上，$ctrl是它自己的作用域，有点像它自己的世界，在它里面定义的每一个方法都不存在于外面，似乎你正在尝试使用$ctrl范围之外的$ctrl.goToHome()。

如果要goToHome()方法在$ctrl范围之外可用。

您可以执行以下两项中的任何一项

• 您可以将goToHome()方法提取到工厂，然后在您想要使用它的任何范围内调用它。这样goToHome()总是做一件事。

const app = angular.module("app", []);
const goToHomeHandler = function() {
return {
goToHome: function() {
alert('go Home');
}
};
};
app.factory('goToHomeHandler', goToHomeHandler);
app.controller("personController", function($scope, goToHomeHandler) {
$scope.firstName = "John";
$scope.lastName = "Doe";
$scope.goToHome = function () {
goToHomeHandler.goToHome();
}
});
app.controller("personController2", function($scope, goToHomeHandler) {
$scope.firstName = "Second John";
$scope.lastName = "Second Doe";
$scope.goToHome = function () {
goToHomeHandler.goToHome();
}
});

• 另一种选择(可能不是最好的(是在$windows范围内定义goToHome()方法，这样就可以在任何地方访问它。

我在下面添加了一个小例子

如您所见，即使test()方法是在personController中创建的，只要通过$windows范围访问它就可以在personController2

中使用

const app = angular.module("app", []);
app.controller("personController", function($scope, $window) {
$window.goToHome = function() {
alert('yoyo');
}
$scope.firstName = "John";
$scope.lastName = "Doe";
$scope.goToHome = function () {
$window.goToHome();
}
});
app.controller("personController2", function($scope, $window) {
$scope.firstName = "Second John";
$scope.lastName = "Second Doe";
$scope.goToHome = function () {
$window.goToHome();
}
});