avaScript文件中调用AngularJS内部方法或改变$scope变量

Posted rongfengliang-荣锋亮

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了avaScript文件中调用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.

以上是关于avaScript文件中调用AngularJS内部方法或改变$scope变量的主要内容,如果未能解决你的问题,请参考以下文章

avascript:属性描述对象

Angular单页应用&AngularJS内部实现原理

Web API 和 AngularJs

使用 Jasmine 在 AngularJS 中测试去抖函数从不调用该函数

Angularjs 指令在 textarea 插入符号处插入文本

将电影从电子内部的 angularJS SPA 上传到 cloudinary