angular 第二章 双向数据绑定

原创 2015年07月07日 15:27:50
<!doctype html>
<html ng-app>
    <head>
        <script src="http://code.angularjs.org/angular-1.0.1.min.js"></script>
    </head>
    <body>
        Your name: <input type="text" ng-model="yourname" placeholder="World">
        <hr>
        Hello {{yourname || 'World'}}!
    </body>

</html>

该示例有一下几点重要的注意事项:

  • 文本输入指令<input ng-model="yourname" />绑定到一个叫yourname的模型变量。
  • 双大括号标记将yourname模型变量添加到问候语文本。
  • 你不需要为该应用另外注册一个事件侦听器或添加事件处理程序!

相关文章推荐

JavaScript实现简单的双向数据绑定(Ember、Angular、Vue)

什么是双向数据绑定呢? 简单的说 就是UI视图与数据绑定在了一块 也就是数据和视图是同步改变的 双向数据绑定最常见的应用场景就是表单 (应用场景还是很有限的)现在我们要实现这样一个简单的数据...

【AngularJs】Angular双向数据绑定

1、什么是双向数据绑定双向数据绑定: Angular实现了双向绑定机制。所谓的双向绑定,无非是从界面的操作能实时反映到数据,数据的变更能实时展现到界面。即数据模型(Module)和视图(View)...

Angular双向数据绑定简易实现

自己最近再看AngularJS,但想了解一下内部原理,于是找到了这篇非常好的文章。 好文章就要分享给大家!不谢。。。 AngularJS数据双向绑定揭秘 Angula...

Angular双向数据绑定

脏检查机制:Angular将双向绑定转换为一堆watch表达式,然后递归这些表达式检查是否发生过变化,如果变了则执行相应的watcher函数(指view上的指令,如ng-bind,ng-show等或是...

jQuery双向数据绑定插件way.js

  • 2014年08月20日 10:15
  • 177KB
  • 下载

Angular2之组件交互和数据绑定

本文主要介绍Angular2的父子组件之间的交互方式、插值语法、属性绑定、事件绑定和双向数据绑定。...

Angular入门 03-$scope作用域、数据绑定

一、作用域 Scope1.1 什么是作用域 基于动态绑定,我们可以依赖视图在修改数据时立刻更新$scope,也可以依赖$scope在其发生变化时立刻重新渲染视图。 AngularJS将$...

angular数据绑定与监控(学习笔记)

基于单一模型的界面同步 ng-model 指令: 可以将输入域的值与 AngularJS 创建的变量绑定。 Add Item {{item}} var ap...

Angular JS解析(四)——模板与数据绑定

在Angular应用中

Angular数据绑定

Angular的数据绑定分为三种: < h1> {{变量名}} :插值表达式(单向绑定) < img [src]="imgUrl"> :属性绑定 : 事件绑定($event是一个事件变量) 下面我们来...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:angular 第二章 双向数据绑定
举报原因:
原因补充:

(最多只允许输入30个字)