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 ...
随机推荐
- BeeFramework 系列
http://ilikeido.iteye.com/category/281079 BeeFramework 系列三 MVC篇上 博客分类: Beeframework iphone开发 mvc框架Be ...
- awk 二
节详细介绍awk内置函数,主要分以下3种类似:算数函数.字符串函数.其它一般函数.时间函数 一.算术函数: 以下算术函数执行与 C 语言中名称相同的子例程相同的操作: 函数名 说明 atan2( y, ...
- 配置Nginx来支持php
安装php7 下载地址:https://secure.php.net/downloads.php这里下载的是:wget http://ar2.php.net/distributions/php ...
- JDK7集合框架源码阅读(五) Hashtable
基于版本jdk1.7.0_80 java.util.Hashtable 代码如下 /* * Copyright (c) 1994, 2011, Oracle and/or its affiliates ...
- Spring Cloud 微服务架构解决方案
1 理解微服务 1.1 软件架构演进 软件架构的发展经历了从单体结构.垂直架构.SOA架构到微服务架构的过程. 1.1.1 单体架构 特点: 1.所有的功能集成在一个项目工程中. 2.所有的功能打一个 ...
- bzoj3225 [Sdoi2008]立方体覆盖——扫描线
3225: [Sdoi2008]立方体覆盖 Description A君近日为准备省队选拔,特意进行了数据结构的专项训练.训练过程中就遇到了“矩形面积并”这道经典问题,即:给出N个各边与坐标轴平行(垂 ...
- Gym - 101194F(后缀数组)
Mr. Panda and Fantastic Beasts 题意 给出若干个字符串,找到一个最短的字典序最小的字符串且仅是第一个字符串的子串. 分析 对于这种多个字符串.重复的子串问题一般都要连接字 ...
- sharepoint 2013 和 office web apps server 2013集成
环境: 三台服务器 系统:window 2008 R2server01: 192.168.10.162(office web app)server02: 192.168.10.163(AD)serv ...
- luogu P1821 [USACO07FEB]银牛派对Silver Cow Party
题目描述 One cow from each of N farms (1 ≤ N ≤ 1000) conveniently numbered 1..N is going to attend the b ...
- PHP缩略图类
class ThumbImages{ /** * 生成缩略图 * prorate 按比例缩放 * distortion 扭曲型缩图 * cut 最小裁剪后的缩图 * backFill 背景填充图 * ...