使用背景:

需要在其他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

 //通过DOM操作获取app对象
var element = angular.element($document.getElementById("app"));
//得到app对象,可以获取app的controller
var controller = element.controller();
//得到app对象,可以获取app的$scope
var scope = element.scope();
//调用$scope中的方法
scope.sub1();
//调用方法后,可以重新绑定,在页面同步(可选)
scope.$apply();
//调用字段
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/

ZH奶酪:JavaScript调用AngularJS的函数/$scope/变量的更多相关文章

  1. 从javascript 调用angular的函数

    从vanilla javascript 调用angular的函数: * 调用 service中的函数var yourService = angular.element(document.body).i ...

  2. ZH奶酪:ionic+angularJS+cordova(FileTransfer)上传图片【移动端】

    [功能介绍] 在开发应用的时候,经常会遇到需要上传图片的功能,比如修改个人资料的头像.本文介绍的是基于ionic框架,在移动端上传图片的功能. [功能流程] (1)点击页面上的头像,弹出一个对话框,选 ...

  3. AngularJS中监视Scope变量以及外部调用Scope方法

    在AngularJS中,有时候需要监视Scope中的某个变量,因为变量的改变会影响一些界面元素的显示.有时,也希望通过jQuery调用Scope的某个方法. 比如以下场景: <div> & ...

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

    需要在其他JavaScript文件中调用AngularJS内部方法或改变$scope变量,同时还要保持双向数据绑定: 首先获取AngularJS application: 方法一:通过controll ...

  5. Android中Webview使用javascript调用事先定义好的Java函数

    1. 首先定义好一个类,专们用于给javascript调用 public class JavaScriptInterface { // share your news public void shar ...

  6. 一款优秀的JavaScript框架—AngularJS

    AngularJS简介 AngularJS诞生于2009年,由Misko Hevery 等人创建,后为Google所收购.是一款优秀的前端JS框架,已经被用于Google的多款产品当中.Angular ...

  7. AngularJs学习笔记--Scope

    原版地址:http://code.angularjs.org/1.0.2/docs/guide/scope 一.什么是Scope? scope(http://code.angularjs.org/1. ...

  8. AngularJS 深入理解 $scope 转载▼

    AngularJS 深入理解 $scope 转载▼ (2015-04-07 14:09:50)     $scope 的使用贯穿整个 AngularJS App 应用,它与数据模型相关联,同时也是表达 ...

  9. javascript面向对象一:函数

    Arguments对象 <script type="text/javascript"> /* Arguments对象: * 在Java中存在函数的重载现象. * 节省了 ...

随机推荐

  1. HTML标签嵌套规则

    摘要:  最近在整理项目时发现有些同事写的页面代码嵌套的太多,而且有些嵌套不对,比如<a><div>内容</div></a>.虽然功能实现了,但是对于浏 ...

  2. Eclipse------使用Maven install出错:编码GBK的不可映射字符

    使用Maven install时报错:编码GBK的不可映射字符 原因:Maven默认使用GBK进行编码 解决方法: 在pom.xml文件中添加如下代码即可 <project> <pr ...

  3. Ulua_toLua_基本案例(六)_LuaCoroutine2

    Ulua_toLua_基本案例(六)_LuaCoroutine2 using UnityEngine; using System.Collections; using LuaInterface; pu ...

  4. 8 -- 深入使用Spring -- 0...

    要点梗概: 利用后处理器扩展Spring容器 Bean后处理器和容器后处理器 Spring3.0 的“零配置” 支持 Spring的资源访问策略 在ApplicationContext中使用资源 AO ...

  5. 在SSH框架中,如何得到POST请求的URL和参数列表

    在做项目的API通知接口的时候,发现在SSH框架中无法获取到对方服务器发来的异步通知信息.最后排查到的原因可能是struts2对HttpServletRequest进行了二次处理,那么该如何拿到pos ...

  6. vuejs监听苹果iphone手机键盘事件

    在iphone手机中,vue提供的keyup事件是不能监听iphone键盘的,但是h5提供的input事件可以做到. 只需要向下面这样处理,就可以解决iphone不响应键盘事件的bug <tem ...

  7. Import VMware ESXi from VirtualBox

    VirtualBox can export appliance VMs to OVF format. And you can import the ovf format to VMware ESXi, ...

  8. Redis 操作哈希数据

    通常我们将一些结构化的信息打包成哈希映射表,结构如下,key/value 键值对模式不变,但 value 是一个键值对 name: "Tom" age: ...... > h ...

  9. windows内核情景分析之—— KeRaiseIrql函数与KeLowerIrql()函数

    windows内核情景分析之—— KeRaiseIrql函数与KeLowerIrql()函数 1.KeRaiseIrql函数 这个 KeRaiseIrql() 只是简单地调用 hal 模块的 KfRa ...

  10. Delphi应用程序的调试(十)调试器选项

    可在两个级别上设置调试选项:工程级和环境级.在前面的讲解中讲解了工程级调试选项,通过主菜单[Project | Options…]打开如下对话框: 可在Debugger Options对话框中设置全局 ...