<!DOCTYPE html>

<html ng-app="myApp1">
<body>
<div ng-controller="myCtrl1" class="container">
<h1>复习：双向数据绑定</h1>
<h2>方向1：Model=>View</h2>
<p>{{emp.age}}</p>
<p ng-bind="emp.age"></p>
<p>{{arr}}</p>
<ul>
<li ng-repeat="n in arr">{{n}}</li>
</ul>
<button ng-click="f1()" class="btn btn-warning">又过了一年</button>
</div>

<script src="js/angular.js"></script>
<script>
//model=>controller=>module
angular.module('myApp1', [])
.controller('myCtrl1', function($scope){
$scope.emp = {};
$scope.emp.age = 20;
$scope.arr = [];
//var f1 = function(){ console.log('f1....') }
$scope.f1 = function(){
$scope.emp.age++; //修改model数据
$scope.arr.push( Math.floor(Math.random()*100) );
}
})
</script>

</body>
<head lang="en">
<meta charset="UTF-8">
<link rel="stylesheet" href="css/bootstrap.css"/>
<title></title>
</head>
</html>

优悦集团（深圳）有限公司

悦享科技  乐享生活

微信：YOJOYGROUP

微博: http://weibo.com/YOJOYGROUP

官网：http://www.yojoygroup.com/

联系&投稿：service@yojoygroup.com

Angular解决双向数据绑定的更多相关文章

  1. Angular JS - 3 - Angular JS 双向数据绑定

    一 .数据绑定 1. 数据绑定: 数据从一个地方A转移(传递)到另一个地方B, 而且这个操作由框架来完成2. 双向数据绑定: 数据可以从View(视图层)流向Model(模型,也就是数据), 也可以从 ...

  2. angular的双向数据绑定

    方向1:模型数据(model) 绑定 到视图(view) 实现方法1:{{model变量名}} $scope.num=10 <p>{{num}}</p> 实现方法2: 常用指令 ...

  3. angularjs探秘<四> 双向数据绑定

    双向数据绑定是angularjs的一大特性,这个特性在实际开发中省了不少事儿.之前第二篇提过数据绑定,这一篇从实际开发的案例中具体看下双向数据绑定的便捷. 首先看一个场景: 在 注册/登录 中经常遇到 ...

  4. 第217天：深入理解Angular双向数据绑定的原理

    一.理解angular双向数据绑定 双向绑定是新的前端框架中频繁出现的一个新词汇,也是mvvm的核心原理.angularjs五条核心信念中的数据驱动,便是由双向绑定进行完成. 那么什么是双向绑定,下面 ...

  5. 双向数据绑定（angular,vue）

    最近github上插件项目更新了关于双向数据绑定的实现方式,关于angular和vue. angular众所周知是使用的脏检查($dirty).一开始大家会认为angular开启了类似setInter ...

  6. Angular双向数据绑定MVVM以及基本模式分析

    MVVM: angular的MVVM实现的是双向数据绑定,模型从服务器端抓取到数据,将数据通过控制器(controller)传递到视图(view)显示,视图数据发生变化时同样也会影响到模型数据的变化, ...

  7. Angular自定义组件实现数据双向数据绑定

    学过Angular的同学都知道,输入框通过[(ngModel)]实现双向数据绑定,那么自定义组件能不能实现双向数据绑定呢?答案是肯定的. Angular中,我们常常需要通过方括号[]和圆括号()实现组 ...

  8. angular,vue,react的基本语法—双向数据绑定、条件渲染、列表渲染、angular小案例

    基本语法: 1.双向数据绑定 vue 指令:v-model="msg" react constructor(){ this.state{ msg:"双向数据绑定" ...

  9. angular和vue双向数据绑定

    angular和vue双向数据绑定的原理(重点是vue的双向绑定) 我在整理javascript高级程序设计的笔记的时候看到面向对象设计那章,讲到对象属性分为数据属性和访问器属性,我们平时用的js对象 ...

随机推荐

  1. IOS 使用KBMMW 访问JAVA 服务

    废话少说,如何使用KBMMW 做个过渡,使IOS 可以使用JAVA 的服务? 其实KBMMW 本身就要java service 的服务,但是为了把这个问题说清楚,我手工做一个例子. 首先,要使用JAV ...

  2. 深入jQuery中的Callbacks()

    引入 初看Callbacks函数很不起眼,但仔细一瞅,发现Callbacks函数是构建jQuery大厦的无比重要的一个基石.jQuery中几乎所有有关异步的操作都会用到Callbacks函数. 为什么 ...

  3. python基础知识9——模块2——常见内置模块

    内置模块 内置模块是Python自带的功能,在使用内置模块相应的功能时,需要[先导入]再[使用] 1.sys 用于提供对Python解释器相关的操作: sys.argv 命令行参数List,第一个元素 ...

  4. ( 转)UVM验证方法学之一验证平台

    在现代IC设计流程中,当设计人员根据设计规格说明书完成RTL代码之后,验证人员开始验证这些代码(通常称其为DUT,Design Under Test).验证工作主要保证从设计规格说明书到RTL转变的正 ...

  5. IELTS Writing Tips

  6. spring mvc 第四天【注解实现springmvc 配合使用Exception Resolver 的配置】

    Tips:这里使用具体springmvc的异常处理只是拿一个简单的案例来说明问题,并不做实用,如有需求可做更改: 这里演示的仅是能够实现service验证的一种方案,如有更好的请留言我会努力学习!! ...

  7. Endless Sky源码学习笔记-4

    事件处理: 事件包括:debug模式切换.切换到登陆窗口.退出.窗口大小变化.全屏切换和游戏中的鼠标键盘输入.处理方式分为两类,前几个为简单的if处理,最后一个涉及到游戏中的控制和交互,且事件由每一个 ...

  8. Tomcat 7.x热部署

    由于在开发阶段,需要频繁的修改源代码,如果每次修改完代码都去重启服务器来检测效果,那简直麻烦到你想死,又耽误时间,所以,在网上找了许久,终于找到了解决办法, 特来分享 我也试了修改Server.xml ...

  9. Android sharePreference使用

    SharedPreferences类,它是一个轻量级的存储类,特别适合用于保存软件配置参数. SharedPreferences保存数据,其背后是用xml文件存放数据,文件存放在/data/data/ ...

  10. POI读取Excel内容格式化

    在用POI读取Excel内容时,经常会遇到数据格式化的问题. 比如:数字12365会变为12365.0;字符串数字123也会变为123.0,甚至会被变为科学计数法.另外日期格式化也是一个头疼的问题.其 ...