我正在使用 AngularJS 构建与旧版 Flex 应用程序交互的 HTML 控件。来自 Flex 应用程序的所有回调都必须附加到 DOM 窗口。
例如（在 AS3 中）
ExternalInterface.call("save", data);
将会通知
window.save = function(data){
// want to update a service
// or dispatch an event here...
}
在 JS 调整大小函数中，我想发送一个控制器可以听到的事件。似乎创建服务是要走的路。您可以从 AngularJS 之外更新服务吗？控制器可以监听来自服务的事件吗？在一个实验中（单击小提琴），我似乎可以访问服务，但更新服务的数据并没有反映在视图中（在示例中，<option>应该添加到<select>）。
谢谢！
从 angular 外部到 angular 的互操作与调试 angular 应用程序或与第三方库集成相同。
对于任何 DOM 元素，您都可以这样做：
angular.element(domElement).scope() 获取元素的当前范围angular.element(domElement).injector() 获取当前的应用注入器angular.element(domElement).controller()获取ng-controller实例。从注入器中，您可以获得 Angular 应用程序中的任何服务。类似地，您可以从范围调用任何已发布到它的方法。
请记住，对 angular 模型的任何更改或作用域上的任何方法调用都需要$apply()像这样包装：
$scope.$apply(function(){
// perform any model changes or method invocations here on angular app.
});
Misko 给出了正确的答案（显然），但我们中的一些新手可能需要进一步简化它。
如果要从遗留应用程序中调用 AngularJS 代码，请将 AngularJS 代码视为存在于遗留应用程序中受保护容器中的“微型应用程序”。你不能直接调用它（有很好的理由），但你可以通过 $scope 对象进行远程调用。
要使用 $scope 对象，您需要获取 $scope 的句柄。幸运的是，这很容易做到。
你可以在你的 AngularJS“微应用”HTML 中使用任何 HTML 元素的 id 来获取 AngularJS 应用 $scope 的句柄。
举个例子，假设我们想在我们的 AngularJS 控制器中调用几个函数，比如 sayHi() 和 sayBye()。在 AngularJS HTML（视图）中，我们有一个 ID 为“MySuperAwesomeApp”的 div。可以使用如下代码，结合jQuery来获取$scope的句柄：
var microappscope = angular.element($("#MySuperAwesomeApp")).scope();
现在你可以通过作用域句柄调用你的 AngularJS 代码函数：
// we are in legacy code land here...
microappscope.sayHi();
microappscope.sayBye();
为了使事情更方便，您可以使用一个函数来随时访问范围句柄：
function microappscope(){
return angular.element($("#MySuperAwesomeApp")).scope();
}
您的电话将如下所示：
microappscope().sayHi();
microappscope().sayBye();
你可以在这里看到一个工作示例：
http://jsfiddle.net/peterdrinnan/2nPnB/16/
我还在 Ottawa AngularJS 小组的幻灯片中展示了这一点（直接跳到最后 2 张幻灯片）
http://www.slideshare.net/peterdrinnan/angular-for-legacyapps
我发现的概念的最佳解释位于：https : //groups.google.com/forum/#! msg/angular/ kqFrwiysgpA/eB9mNbQzcHwJ
为了节省您的点击：
// get Angular scope from the known DOM element
e = document.getElementById('myAngularApp');
scope = angular.element(e).scope();
// update the model with a wrap in $apply(fn) which will refresh the view for us
scope.$apply(function() {
scope.controllerMethod(val);
});
进一步的其他答案。如果您不想访问控制器中的方法但想直接访问服务，您可以执行以下操作：
// Angular code* :
var myService = function(){
this.my_number = 9;
}
angular.module('myApp').service('myService', myService);
// External Legacy Code:
var external_access_to_my_service = angular.element('body').injector().get('myService');
var my_number = external_access_to_my_service.my_number
感谢上一篇文章，我可以使用异步事件更新我的模型。
<div id="control-panel" ng-controller="Filters">
<ul>
<li ng-repeat="filter in filters">
<button type="submit" value="" class="filter_btn">{{filter.name}}</button>
</li>
</ul>
</div>
我声明我的模型
function Filters($scope) {
$scope.filters = [];
}
我从我的范围之外更新我的模型
ws.onmessage = function (evt) {
dictt = JSON.parse(evt.data);
angular.element(document.getElementById('control-panel')).scope().$apply(function(scope){
scope.filters = dictt.filters;
});
};