javascript - AngularJs : Call controller function bound to 'this' from outside(eg. 浏览器控制台)

Question

我有以下代码，现在假设我想从外部某个地方调用 foo(val) 函数，比如说浏览器控制台。

angular.module('app', []);
angular.module('app')
    .controller('MyController', MyController);

function MyController() {
    var self = this;
    self.foo = function(val) {
        console.log(val);
    };
    return self;
}

下面的代码仅在 foo() 绑定(bind)到 $scope 时有效。

angular.element(document.getElementById('MyController')).scope().foo('Hello');

有什么解决办法吗？否则我将被迫使用 $scope 来实现此目的？

Answer 1

当使用“controllerAs”语法实例化 Controller 时，this 上下文将绑定(bind)到具有指定名称的范围属性:

<div id="MyController" ng-controller="MyController as vm">
    <button ng-click="vm.foo()">
        Click foo
    </button>
</div>

$scope = angular.element(document.getElementById('MyController')).scope()

$scope.vm.foo('Hello');
$scope.$apply();

从控制台执行的上述命令将执行与单击 Click foo 按钮相同的操作。