ionic准备之angular基础——$watch,$apply,$timeout方法（5）
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body ng-app="myApp"> <!--$watch用法-->
<div ng-controller="firstController">
数量：<input type="text" ng-model="amount"><br>
价格：{{price}}<br>
总计：{{sum}}<br>
</div> <!--apply用法-->
<div ng-controller="secondController">{{num}}</div> <!--$timeout用法-->
<div ng-controller="threeController">{{num}}</div>
</body>
<script src="angular/angular.js"></script>
<script type="text/javascript">
var app=angular.module("myApp",[]); app.controller('firstController',function($scope){
$scope.amount=123;
$scope.price=20;
$scope.sum= $scope.amount*$scope.amount;
$scope.$watch('amount',function(newValue,oldValue){ //更新amount变化
$scope.sum=newValue*$scope.price;
});
}) /*$apply用法*/
app.controller('secondController',function($scope){
$scope.num=20;
setTimeout(function(){
$scope.num=30;
$scope.$apply(); /*更新view*/
},1500);
}) /*$timeout用法*/
app.controller("threeController",function($scope,$timeout){
$scope.num=20;
$timeout(function(){
$scope.num=30;
},1200);
}); </script>
</html>
ionic准备之angular基础——$watch,$apply,$timeout方法（5）的更多相关文章
- 秒味课堂Angular js笔记------Angular js中的工具方法
Angular js中的工具方法 angular.isArray angular.isDate angular.isDefined angular.isUndefined angular.isFunc ...
- MysqlDataSource里的Connection实现类实现了isValid(int timeout)方法
在项目中,需要连接mysql数据库的时候,我们最好选择使用数据库连接池,即需要选择DataSource. 而在使用c3p0的ComboPooledDataSource时,发现它的Connection实 ...
- Angular开启两个项目方法
Angular开启两个项目方法: ng server --port 80
- angular基础巩固
angular中的模块化 //定义模块 []为依赖的模块 moduleName可以使用[]模块中定义的controller filter .. var app=angular.module('modu ...
- ionic准备之angular基础——dom操作相关（6）
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- angular 基础练习
<!DOCTYPE HTML> <html> <head> <title> 测试页 </title> <meta charset=&q ...
- Angular基础开始
这个我是想用Angular写一个简单的WebApp,这个是一个简简单单路由: 公共模板--index.html: <!DOCTYPE html> <html ng-app='myAp ...
- ionic准备之angular基础———服务provider 和 factory和service（9）
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- ionic准备之angular基础——格式化数据以及过滤器（8）
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
随机推荐
- 洛谷T8116 密码
T8116 密码 题目描述 YJC把核弹发射密码忘掉了……其实是密码被加密了,但是YJC不会解密.密码由n个数字组成,第i个数字被加密成了如下形式:第k小的满足(2^L)|(P-1)且P为质数的P.Y ...
- MTK_GPIO口的定制
http://blog.csdn.net/zuoyioo7/article/details/77863291如果需要定制GPIO口呢,需要使用mediatek/dct/DrvGen.exe工具,点击O ...
- C++文件(夹)选择对话框
由于各种应用,我们需要调用系统的打开文件对话框或者打开文件夹对话框,或两者兼有.今遇到这个情况已经解决,特写下这篇博文. 1.打开文件对话框常用的方法是使用系统的CFileDialog.这里介绍另外一 ...
- 解决viewpager+多个fragment+listview，listview展示内容高度不自适应出现多余空白问题
一.重写viewpager import android.content.Context; import android.support.v4.view.ViewPager; import andro ...
- Ubuntu16.10 +python3.5+Tensorflow 1.1
1.python版本检查 因为Ubuntu16.10已经默认安装了python2.7 和 3.5,检查python版本, 如果为python2.7,那么就需要我们设置python3.5为默认版本. 查 ...
- [jquery] 给动态生成的元素绑定事件 on方法
用底下的方法尝试了好多次都失败 $('.del').on('click',function(){ alert('aa'); })// 失败!! 终于在准备放弃前看到一篇博文说的方法 $(documen ...
- 用了GradientDrawable后，当点击控件时，控件大小发生变化
android新手:发现一个很奇怪的问题,用了GradientDrawable后,当点击控件时,程序自动使我的一些控件大小保持一致,为什么呢,我就是不想它们保持一致啊 改了好久好久:GradientD ...
- Python的程序结构[2] -> 类/Class[2] -> 方法解析顺序 MRO
方法解析顺序 / MRO (Method Resolution Order) 关于方法解析顺序(MRO)的详细内容可以参考文末链接,这里主要对 MRO 进行简要的总结说明以及一些练习示例. 经典类和新 ...
- HDOJ 3516 Tree Construction 四边形优化dp
原题链接:http://acm.hdu.edu.cn/showproblem.php?pid=3516 题意: 大概就是给你个下凸包的左侧,然后让你用平行于坐标轴的线段构造一棵树,并且这棵树的总曼哈顿 ...
- Union与UnionAll
UNION指令的目的是将两个SQL语句的结果合并起来.从这个角度来看, 我们会产生这样的感觉,UNION跟JOIN似乎有些许类似,因为这两个指令都可以由多个表格中撷取资料. UNION的一个限制是两个 ...