AngularJS 模型
ng-model 指令将HTML 控制器(input, select, textarea)的值 和 应用程序数据进行绑定。
ng-model 指令
ng-model
指令可以将输入域的值与 AngularJS 创建的变量绑定。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
</head>
<body> <div ng-app="myApp" ng-controller="myCtrl">
名字: <input ng-model="name">
</div> <script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
$scope.name = "John Doe";
});
</script> <p>使用 ng-model 指令来绑定输入域的值到控制器的属性。</p> </body>
</html>
aaarticlea/png;base64,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" alt="" />
双向绑定
双向绑定,在修改输入域的值时, AngularJS 属性的值也将修改。
可以看到,它是实时同步更新的。input中每输入一个字,它就立刻同步到数据模型,这是因为每次输入input,都会触发一个input的事件。然后 angular就会执行的$digest循环,直到模型稳定下来。我们不用手动设置任何事件监听来同步更新视图和模型,这样很赞,这就是angular的目的。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
</head>
<body> <div ng-app="myApp" ng-controller="myCtrl">
名字: <input ng-model="name">
<h1>你输入了: {{name}}</h1>
</div> <script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
$scope.name = "John Doe";
});
</script> <p>修改输入框的值,标题的名字也会相应修改。</p> </body>
</html>
aaarticlea/png;base64,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" alt="" />
验证用户输入
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
</head>
<body> <form ng-app="" name="myForm">
Email:
<input type="email" name="myAddress" ng-model="text">//此处ng-model不能为空
<span ng-show="myForm.myAddress.$error.email">不是一个合法的邮箱地址</span>
</form> <p>在输入框中输入你的邮箱地址,如果不是一个合法的邮箱地址,会弹出提示信息。</p> </body>
</html>
aaarticlea/png;base64,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" alt="" />
以上实例中,提示信息会在 ng-show
属性返回 true
的情况下显示。
应用状态
ng-model
指令可以为应用数据提供状态值(invalid, dirty, touched, error):
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
</head>
<body> <form ng-app="" name="myForm" ng-init="myText = 'test@runoob.com'"> Email:
<input type="email" name="myAddress" ng-model="myText" required>
<p>编辑邮箱地址,查看状态的改变。</p>
<h1>状态</h1>
<p>Valid: {{myForm.myAddress.$valid}} (如果输入的值是合法的则为 true)。</p>
<p>Dirty: {{myForm.myAddress.$dirty}} (如果值改变则为 true)。</p>
<p>Touched: {{myForm.myAddress.$touched}} (如果通过触屏点击则为 true)。</p> </form> </body>
</html>
aaarticlea/png;base64,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" alt="" />
CSS 类
ng-model
指令基于它们的状态为 HTML 元素提供了 CSS 类:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
<style>
input.ng-invalid {
background-color: lightblue;
}
</style>
</head>
<body> <form ng-app="" name="myForm">
输入你的名字:
<input name="myName" ng-model="myText" required>
</form> <p>编辑文本域,不同状态背景颜色会发送变化。</p>
<p>文本域添加了 required 属性,该值是必须的,如果为空则是不合法的。</p> </body>
</html>
aaarticlea/png;base64,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" alt="" />
ng-model
指令根据表单域的状态添加/移除以下类:
- ng-empty
- ng-not-empty
- ng-touched
- ng-untouched
- ng-valid
- ng-invalid
- ng-dirty
- ng-pending
- ng-pristine
AngularJS 模型的更多相关文章
- AngularJS模型
1. AngularJS模型主要就是使用的AngularJS的ng-model指令. ng-model指令可以将输入域的值与 AngularJS 创建的变量绑定. <!DOCTYPE html& ...
- AngularJS模型 ng-model 指令
ng-model 指令用于绑定应用程序数据到 HTML 控制器(input, select, textarea)的值. ng-model 指令可以将输入域的值与 AngularJS 创建的变量绑定.例 ...
- AngularJS学习之旅—AngularJS 模型(四)
1.AngularJS ng-model 指令 1.ng-model 指令用于绑定应用程序数据到 HTML 控制器(input, select, textarea)的值. 2.ng-model 指令可 ...
- AngularJs之三
一.angularJs的指令模型ng-model指令 ng-model 指令 绑定 HTML 元素 到应用程序数据. 为应用程序数据提供类型验证(number.email.required).为应用程 ...
- angularJS(3)
angularJS(3) 一.angularJs的指令模型ng-model指令 ng-model 指令 绑定 HTML 元素 到应用程序数据. 为应用程序数据提供类型验证(number.email ...
- AngularJS Bootstrap
AngularJS 的首选样式表是 Bootstrap. 可以在 AngularJS 应用中加入 Twitter Bootstrap,你可以在你的 <head>元素中添加如下代码: < ...
- 1.AngularJS初探
1.需要什么前端开发环境 1)代码编辑工具 webstorm 2)断点调试工具 chrome插件Batarang 3)版本管理 tortoiseGit 4)代码合并和混淆工具 grunt-contri ...
- AngularJS安装配置与基础概要整理(上)
以前整理的,可供参考. 安装: 1.首先要安装node.js和它的npm包管理系统.(nodejs相关待整理) 2.安装grunt .grunt是一个基于任务的Javascript工程命令行构建工具. ...
- angularjs基础——变量绑定
1)弄一个ng-app(angularjs 应用) 2)在里面用ng-model(angularjs 模型)就可以定义一个模型变量 3)使用模版方法就可以输出变量了(例如:{{name}}) 示例: ...
随机推荐
- WP8.1学习系列(第二十三章)——到控件的数据绑定
在本文中 先决条件 将控件绑定到单个项目 将控件绑定到对象的集合 通过使用数据模板显示控件中的项目 添加详细信息视图 转换数据以在控件中显示 相关主题 本主题介绍了如何在使用 C++.C# 或 Vis ...
- Android Studio 3.1.2 版本包下载
Android Studio 3.1.2 bug 修复版已发布,本次更新修复了一些错误,并改进了某些场景下 lint 审查的速度.详细的修复内容请查看 Android Studio 3.1.2 的发布 ...
- Elasticsearch学习之深入搜索六 --- 平衡搜索结果的精准率和召回率
1. 召回率和精准度 比如你搜索一个java spark,总共有100个doc,能返回多少个doc作为结果,就是召回率,recall 精准度,比如你搜索一个java spark,能不能尽可能让包含ja ...
- LeetCode 14 Longest Common Prefix(最长公共前缀)
题目链接:https://leetcode.com/problems/longest-common-prefix/?tab=Description Problem: 找出给定的string数组中最 ...
- 应用程序创建自己的奔溃转储(crash dump)文件
1.注册自定义的UnhandledExceptionFilter,C/C++ Runtime Library下需要注意自定义handler被移除(hook kernel32.dll的SetUnhand ...
- 【读书笔记】socket描述符选项[SOL_SOCKET]
#include <sys/socket.h> int setsockopt( int socket, int level, int option_name, ...
- Centos 7.x系统安装后的初始化配置
1.配置IP.网关,编辑/etc/sysconfig/network-scripts/ifcfg-eno16777736 TYPE=Ethernet BOOTPROTO=none //默认为dhcp ...
- Android - 安装应用(APP) 不显示图标
装应用(APP) 不显示图标 本文地址:www.2cto.com 在启动的activity的AndroidManifest注册中,添加隐式启动的data: 删除应用图标的若干解决方案: 1.Andro ...
- 在eclipse pydev中使用PEP8来规范python代码
最近在写接口自动话时,代码要上研发的PEP8检查,所以没办法,在pydev中配置如下: 1.打开PEP检查 在pydev 2.3.0之后的版本都自带了pep8检查,但默认是没有开启的 Windows ...
- 【转】python中json.loads与eval的区别
JSON有两种结构: “名称/值”对的集合(A collection of name/value pairs).不同的语言中,它被理解为对象(object),纪录(record),结构(struct) ...