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 ...
随机推荐
- DatacontractAttribute的使用规则
关于DatacontractAttribute的使用规则和说明, DatacontractAttribute是序列化类的另一种方法,和XmlMemberAttribute(也就是XmlElementA ...
- (转）python 模块安装包 制作
转自: http://testerhome.com/topics/539 用过python的同学对于python setup.py install肯定不会陌生.那么我们自己如果封装了很多的方法怎么很好 ...
- iphone CGBitmapContextCreate()函数解释
http://blog.sina.com.cn/s/blog_3e50cef401019cd2.html CGContextRef CGBitmapContextCreate ( void *data ...
- (九)ubuntu解决resolv.conf被重写问题
解决resolv.conf被重写问题 来源:http://www.cnblogs.com/lanxuezaipiao/p/3613497.html 第二步中你虽然配置了DNS,但是每次重启虚拟机或重启 ...
- nginx 根据POST GET方法跳转
location ~ /server/ { proxy_pass_header Server; proxy_set_header Host $http_host; proxy_r ...
- Oracle sql例子
create database oracle1 )) select * from class ,'一班') ,'二班') ,'三班') --创建学生表 ),cid int ,constraint FK ...
- 牛客网 暑期ACM多校训练营（第一场）A.Monotonic Matrix-矩阵转化为格子路径的非降路径计数，Lindström-Gessel-Viennot引理-组合数学
牛客网暑期ACM多校训练营(第一场) A.Monotonic Matrix 这个题就是给你一个n*m的矩阵,往里面填{0,1,2}这三种数,要求是Ai,j⩽Ai+1,j,Ai,j⩽Ai,j+1 ,问你 ...
- (1) SpringBoot创建发布
一.安装jdk8 https://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html 二.配置环境 ...
- Codeforces Beta Round #4 (Div. 2 Only) C. Registration system【裸hash/map】
C. Registration system time limit per test 5 seconds memory limit per test 64 megabytes input standa ...
- Python Unittest与数据驱动
python中有一个装饰器类DDT,通过它我们可以复用代码,达到数据驱动测试的目的,该类的官方介绍可以参考 http://ddt.readthedocs.io/en/latest/index.html ...