时间:2021-05-28
在AngularJS中,有时候需要监视Scope中的某个变量,因为变量的改变会影响一些界面元素的显示。有时,也希望通过jQuery调用Scope的某个方法。
比如以下场景:
以上,我们希望:
● Scope中的jQBtnState变量值如果为false让id为jQBtn的按钮禁用
● 点击id为jQBtn的按钮调用Scope中的某个方法让Scope中的变量counter自增1
我们可能会这样写:
$('#jQBtn').on("click", function(){console.log("JQuery button clicked");//需要考虑的问题是://这里如何调用Scope中的某个方法,使Scope的的变量counter自增1})...
myApp.controller("NGCtrl", function($scope){$scope.counter = 0;//这里,怎么让jQBtnState变量值发生变化告之外界呢?$scope.jQBtnState = false;$scope.jQBtnClick = function(){$scope.counter++;}})其实,使用$watch方法可以监视Scope某个变量的变化,当变化发生调用回调函数。
以上,当jQBtnState变量值为false的时候就会禁用id为jQBtn的按钮。
外界如何调用Scope的方法呢?
--先获取Scope,然后使用$apply方法调用Scope内的方法。$('#jQBtn').on("click", function(){console.log("JQuery button clicked");var scope = angular.element(ngSection).scope();scope.$apply(function(){scope.jQBtnClick();});})以上,通过获取Scope,使用$apply方法调用Scope内的jQBtnClick方法使Scope呢的变量counter自增1。
以上所述是针对AngularJS中监视Scope变量以及外部调用Scope方法 的相关知识,希望对大家有所帮助。
声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。
AngularJSng-model指令AngularJS实例绑定输入框的值到scope变量中:input输入框的值绑定了变量"name":{{name}}var
本文实例讲述了AngularJS中scope的绑定策略。分享给大家供大家参考,具体如下:当scope选项写为scope:{}这种形式的时候,就已经为指令生成了隔
前言AngularJS中scope之间的继承关系使用JavaScript的原型继承方式实现。本文结合AngularJSScope的实现以及相关资料谈谈原型继承机
这两天学习了AngularJs之$scope对象这个地方知识点挺多的,而且很重要,所以,今天添加一点小笔记。一、作用域AngularJs中的$scope对象是模
AngularJSng-model-options指令AngularJS实例在失去焦点时绑定输入框的值到scope变量中:更新输入框:在失去焦点时绑定输入框的值