ZH奶酪:JavaScript調用AngularJS的函數/$scope/變量


使用背景:

需要在其他JavaScript文件中調用AngularJS內部方法或改變$scope變量,同時還要保持雙向數據綁定;

首先獲取AngularJS application:

方法一:通過controller來獲取app

var appElement = document.querySelector('[ng-controller=mainController]');

然后在獲取$scope變量:

var $scope = angular.element(appElement).scope(); 

如果改變了其中的變量之后,需要在頁面表現出來,還需要調用apply()方法:

$scope.$apply();

方法二:通過DOM操作獲取app

 1 //通過DOM操作獲取app對象
 2 var element = angular.element($document.getElementById("app"));
 3 //得到app對象,可以獲取app的controller
 4 var controller = element.controller();
 5 //得到app對象,可以獲取app的$scope
 6 var scope = element.scope();
 7 //調用$scope中的方法
 8 scope.sub1();
 9 //調用方法后,可以重新綁定,在頁面同步(可選)
10 scope.$apply();
11 //調用字段
12 scope.field1;

幾個相關函數:

獲取當前元素的$socpe:     angular.element(domElement).scope() to get the current scope for the element
獲取當前app的injector:   angular.element(domElement).injector() to get the current app injector
獲取當前元素的controller:angular.element(domElement).controller() to get a hold of the ng-controller instance.

參考文章:

http://segmentfault.com/a/1190000000747708

http://longqiang.name/2014/12/13/%E5%A4%96%E9%83%A8js%E8%B0%83%E7%94%A8angularjs%E5%86%85%E9%83%A8%E6%96%B9%E6%B3%95/

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM