javascript - 如何从外部访问组件Controller

Question

我使用的是 Angular 1.5，我有一个这样的组件

        angular
        .module('appliactionModule')
        .component('umleditor', {
            bindings: {
                 ...
            },
            templateUrl: 'app/uml-editor/umleditor.html',
            controller: UmlEditorController
        });

       function UmlEditorController( ... ){ ... };

然后在 app/uml-editor/umleditor.html 中，我希望有一些 javascript 能够像这样访问 Controller UmlEditorController:

<div class="editor-wrapper" id="editor">
  ...
  <script>
     // Accessing Services like this works
     var FooService = angular.element('*[ng-app]').injector().get("FooService");

     // How do I get the controller?
      controller.doSomething();

  </script>
</div>

如何从外部获取对我的 Controller 的引用，以便我可以从常规 JavaScript(而非 Angular)中使用它？

Answer 1

如果有 umleditor 组件， Controller 实例可以通过以下方式检索:

angular.element(document.getElementById("editor")).controller('umleditor');

或者

angular.element(document.getElementById("editor")).isolateScope().$ctrl;

这被认为是一种不好的做法，应该用于测试或作为快速修复。通常必须做相反的事情，外部 JS 代码应该用 Angular 应用程序包装。