秒味课堂Angular js笔记------$scope.$watch和$scope.$apply

时间:2022-05-30 00:31:45
  • $scope.$watch(watchFn , watchAction , deepWatch)

其中,watchFn是带有angular表达式或函数字符串;

watchAction是一个函数或者表达式,当watchFn发生变化时调用,如果是函数,其签名是function(newValue, oldValue, scope);

deepWatch如果是ture,则会检查被监控对象的每一个属性是否发生了变化。

<script type="application/javascript">
var modelMy = angular.module('modelMy',[]);
modelMy.controller('shopList',['$scope',function($scope){ //scope容易被压缩成简短的其他字符 可以用第二种方法
$scope.unitPrice = 38;
$scope.count = 3;
$scope.fre = 8;
$scope.total = function(){
return $scope.unitPrice * $scope.count;
};
/* $scope.$watch( 'count' , function(value){ //监听$watch 单个''
console.log(value);
})*/
$scope.$watch( $scope.total , function(value){ //监听$watch 函数
$scope.fre = value >= 100 ? 0 : 8;
})
}])
</script>
  • $scope.$apply
<body ng-app="myApp">
<div ng-controller="MessageController">
Delayed Message: {{message}}
</div>
</body>
<script>
var m1 = angular.module('myApp',[]);
m1.controller('MessageController', function($scope) {
$scope.getMessage = function() {
setTimeout(function() {
$scope.$apply(function() { // 在这应用$apply方法
$scope.message = '2秒后显示该文字';
console.log('message:' + $scope.message);
});
}, 2000);
} $scope.getMessage(); });
</script>

秒味课堂Angular js笔记------$scope.$watch和$scope.$apply的更多相关文章

  1. 秒味课堂Angular js笔记------Angular js中的工具方法

    Angular js中的工具方法 angular.isArray angular.isDate angular.isDefined angular.isUndefined angular.isFunc ...

  2. 秒味课堂Angular js笔记------指令

    1.属性指令 angularjs样式相关指令: ng-class ng-style ng-href ng-src ng-attr-(suffix) ng-bind ng-cloak  没解析完之前标签 ...

  3. 秒味课堂Angular js笔记------过滤器

    不同过滤器的小demo. currency number uppercase json limitTo date orderBy filter <script> var filterMy ...

  4. Angular JS笔记

    1.引导程序 使用ng-app开始引导一个程序:标记了AngularJS应用的作用域 <!doctype html> <html lang="en" ng-app ...

  5. 【妙味课堂】JS热身课后习题

    <!--*** @Author: wyy* @Date: 2018-04-15 17:36:35* @Email: 2752154874@qq.com* @Last Modified by: w ...

  6. 妙味课堂&colon;JavaScript初级--第11课:字符串、查找高亮显示

    1.数字字母 Unicode 编码 <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content- ...

  7. angular&period;js 中同步视图和模型数据双向绑定&comma;&dollar;watch &dollar;digest &dollar;apply 机制

    Angular.js 中的特性,双向绑定. 让视图的改变直接反应到数据中,数据的改变又实时的通知到视图,如何做到的? 这要归功于 scope 下面3个重要的方法: $watch $digest $ap ...

  8. 妙味课堂——HTML&plus;CSS基础笔记

    妙味课堂的课程讲得非常的清楚,受益匪浅.先把HTML和CSS基础课程部分视频的学习笔记记录如下: padding #PS基础 ##前端需要的PS技能 - PS技能(前端需要):切图.修图.测量 - P ...

  9. 妙味课堂——JavaScript基础课程笔记

    集中时间把秒微课堂JS的基础课程看完,并且认真完成了课后练习.感觉在JS方面的技能算是入了个门了.课后练习的作业完成的代码我都汇总在了这里.至于视频课的学习笔记,则记录如下. 第01课JS入门基础_热 ...

随机推荐

  1. iOS self

    如果self在对象方法中 那么self就代表调用当前对象方法的那个对象 如果self在类方法中 那么self就代表调用当前类方法的那个类 总结:self的使用只需关注self在哪个方法中 如果在类方法 ...

  2. C&num;&lowbar;简单实用的翻页

    简单实用的生成翻页HTML辅助类 C# using System.Text; namespace ClassLibrary { /// <summary> /// /// </sum ...

  3. ilbc编解码

    针对国内的博客或者技术论坛对 ILBC的论述都是把文章抄来抄去, 本人在此对 ILBC的具体代码实现详细列出代码. ILBC是由Global IP Sound公司提出的一种专为包交换网络通信设计的编解 ...

  4. ubuntu中的Wine详解

    什么是wine?(转自百度百科,具体看百科) wine,是一款优秀的Linux系统平台下的模拟器软件,用来将Windows系统下的软件在Linux系统下稳定运行,该软件更新频繁,日臻完善,可以运行许多 ...

  5. SpringMvc入门五----文件上传

      知识点: SpringMvc单文件上传 SpringMvc多文件上传   这里我直接演示多文件上传,单文件的上传就不说了,不过代码都是现成的. 效果预览:   DEMO图:     添加文件上传j ...

  6. &UpperRightArrow;☻【HTML5秘籍 &num;BOOK&num;】第2章 构造网页的新方式

    div division 分区article 表示一个完整的.自成一体的内容块,比如博文文章或新闻报道hgroup 标注副标题 从结构上讲,它只关注*标题(也就是这里的h1).其他标题也会显示在浏览 ...

  7. 如何选择NoSql数据库

    How to choose a No Sql database 介绍了一下怎么选择一个No Sql数据库,下面简单翻译一下重点. No Sql的数据库可以分为如下4类: Key-Value数据库 数据 ...

  8. 【USACO 3&period;2&period;2】二进制数01串

    [描述] 考虑排好序的N(N<=31)位二进制数. 你会发现,这很有趣.因为他们是排列好的,而且包含所有可能的长度为N且含有1的个数小于等于L(L<=N)的数. 你的任务是输出第I(1&l ...

  9. jsoncpp 不能处理long类型数据

    jsoncpp,是一个c++的解析和生成json的开源工具.假设你的c++程序须要解析或生成json,它会使这个过程变得非常easy! 可是,今天在用jsoncpp进行生成json的时候报了错误,非常 ...

  10. linux下源码编译安装mysql

    1.安装依赖的包: yum install -y gdb cmake ncurses-devel bison bison-devel 2.创建mysql安装目录和数据文件目录 mkdir -p /us ...