AngularJS访问范围从外部的jsfunction
我试图看看是否有一个简单的方法来访问控制器的内部范围通过外部的JavaScript函数（完全不相关的目标控制器）
我在这里看到了其他一些问题
angular.element("#scope").scope();
会从DOM元素中检索范围，但是我的尝试目前没有得到适当的结果。
这里是jsfiddle： http : //jsfiddle.net/sXkjc/5/
我目前正在从简单的JS过渡到Angular。 我试图做到这一点的主要原因是保持我的原始库代码尽可能完好; 节省了我将每个function添加到控制器的需要。
关于如何实现这一点的任何想法？ 上述小提琴的评论也是受欢迎的。
你需要使用$ scope。$ apply（）如果你想从angularjs的控制之外做一个范围值的任何改变，比如jquery / javascript事件处理器。
function change() { alert("a"); var scope = angular.element($("#outer")).scope(); scope.$apply(function(){ scope.msg = 'Superhero'; }) }
演示： 小提琴
自从我发布这个问题已经有一段时间了，但考虑到这个问题似乎仍然存在，下面是我在过去几个月中遇到的另一个解决scheme：
$scope.safeApply = function( fn ) { var phase = this.$root.$$phase; if(phase == '$apply' || phase == '$digest') { if(fn) { fn(); } } else { this.$apply(fn); } };
上面的代码基本上创build了一个名为safeApply的函数，该函数调用$apply函数（如Arun的答案中所述），并且只有Angular目前没有经过 $digest阶段。 另一方面，如果Angular 正在消化事物，那么它只会执行这个函数，因为这将足以向Angular发出信号来进行更改。
尝试使用$apply函数时出现了许多错误，而AngularJs目前处于$digest阶段。 上面的safeApply代码是防止这种错误的安全包装。
（注意：为了方便，我个人喜欢在safeApply作为$rootScope的函数来查找）
例：
function change() { alert("a"); var scope = angular.element($("#outer")).scope(); scope.safeApply(function(){ scope.msg = 'Superhero'; }) }
演示： http : //jsfiddle.net/sXkjc/227/
我们可以在加载后调用它
http://jsfiddle.net/gentletech/s3qtv/3/
<div id="wrap" ng-controller="Ctrl"> {{message}}<br> {{info}} </div> <a onClick="hi()">click me </a> function Ctrl($scope) { $scope.message = "hi robi"; $scope.updateMessage = function(_s){ $scope.message = _s; }; } function hi(){ var scope = angular.element(document.getElementById("wrap")).scope(); scope.$apply(function() { scope.info = "nami"; scope.updateMessage("i am new fans like nami"); }); }
另一种方法是：
var extScope; var app = angular.module('myApp', []); app.controller('myController',function($scope, $http){ extScope = $scope; }) //below you do what you want to do with $scope as extScope extScope.$apply(function(){ extScope.test = 'Hello world'; })
我问这个问题已经很长时间了，但是这里有一个不需要jQuery的答案：
function change() { var scope = angular.element(document.querySelector('#outside')).scope(); scope.$apply(function(){ scope.msg = 'Superhero'; }) }
这是一个可重用的解决scheme： http : //jsfiddle.net/flobar/r28b0gmq/
function accessScope(node, func) { var scope = angular.element(document.querySelector(node)).scope(); scope.$apply(func); } window.onload = function () { accessScope('#outer', function (scope) { // change any property inside the scope scope.name = 'John'; scope.sname = 'Doe'; scope.msg = 'Superhero'; }); };
你也可以尝试：
function change() { var scope = angular.element( document.getElementById('outer') ).scope(); scope.$apply(function(){ scope.msg = 'Superhero'; }) }
接受的答案是伟大的。 我想看看在ng-repeat的情况下Angular范围会发生什么。 事情是，Angular将为每个重复的项目创build一个子范围。 调用原始$scope定义的方法时，将保留其原始值（由于javascriptclosures）。 但是， this是指调用范围/对象。 只要你清楚何时$scope和this是相同的，当它们是不同的时候，这个效果很好。 心连心
这是一个小提琴，说明不同之处： https : //jsfiddle.net/creitzel/oxsxjcyc/
我是新手，很抱歉如果是不好的做法。 根据select的答案，我做了这个function：
function x_apply(selector, variable, value) { var scope = angular.element( $(selector) ).scope(); scope.$apply(function(){ scope[variable] = value; }); }
我这样使用它：
x_apply('#fileuploader', 'thereisfiles', true);
顺便说一句，对不起我的英文
<input type="text" class="form-control timepicker2" ng-model='programRow.StationAuxiliaryTime.ST88' />
访问范围值
假定programRow.StationAuxiliaryTime是一个对象数组
$('.timepicker2').on('click', function () { var currentElement = $(this); var scopeValues = angular.element(currentElement).scope(); var model = currentElement.attr('ng-model'); var stationNumber = model.split('.')[2]; var val = ''; if (model.indexOf("StationWaterTime") > 0) { val = scopeValues.programRow.StationWaterTime[stationNumber]; } else { val = scopeValues.programRow.StationAuxiliaryTime[stationNumber]; } currentElement.timepicker('setTime', val); });
