AngularJS基础 ng-model 指令详解及示例代码


Posted in Javascript onAugust 02, 2016

AngularJS ng-model 指令

AngularJS 实例

绑定输入框的值到 scope 变量中:

<!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">

<p>input 输入框的值绑定了变量 "name" :</p>
{{name}}

</div>

<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
  $scope.name = "John Doe";
});
</script>

<p>该实例演示了如何使用 ng-model 指令绑定输入框的值到 scope 变量中。</p>

</body>
</html>

定义和用法

ng-model 指令绑定了 HTML 表单元素到 scope 变量中。

如果 scope 中不存在变量, 将会创建它。

语法

<element ng-model="name"></element>

<input>, <select>, <textarea>, 元素支持该指令。

参数值

 

描述
separator 你想要绑定到表单域的属性名。

 以上就是对AngularJS ng-model资料的整理,后续继续补充相关资料。

Javascript 相关文章推荐
如何快速的呈现我们的网页的技巧整理
Jul 01 Javascript
flexigrid 类似ext grid的JS表格代码
Jul 17 Javascript
JS增加行复制行删除行的实现代码
Nov 09 Javascript
js操作输入框中选择内容兼容IE及其他主流浏览器
Apr 22 Javascript
jquery JSON的解析方式示例介绍
Jul 27 Javascript
jQuery.Callbacks()回调函数队列用法详解
Jun 14 Javascript
js添加千分位的实现代码(超简单)
Aug 01 Javascript
jQuery获取选中单选按钮radio的值
Dec 27 Javascript
jQuery仿移动端支付宝键盘的实现代码
Aug 15 jQuery
js实现石头剪刀布游戏
Oct 11 Javascript
从源码角度来回答keep-alive组件的缓存原理
Jan 18 Javascript
详解Vue的七种传值方式
Feb 08 Vue.js
JS获取input file绝对路径的方法(推荐)
Aug 02 #Javascript
JavaScript实现复制文章自动添加版权
Aug 02 #Javascript
js获取上传文件的绝对路径实现方法
Aug 02 #Javascript
AngularJS基础 ng-list 指令详解及示例代码
Aug 02 #Javascript
jQuery设置聚焦并使光标位置在文字最后的实现方法
Aug 02 #Javascript
jQuery实现的placeholder效果完整实例
Aug 02 #Javascript
AngularJS基础 ng-keyup 指令简单示例
Aug 02 #Javascript
You might like
php断点续传之文件分割合并详解
2016/12/13 PHP
php引用和拷贝的区别知识点总结
2019/09/23 PHP
用javascript getComputedStyle获取和设置style的原理
2008/10/10 Javascript
仿新浪微博返回顶部的jquery实现代码
2012/10/01 Javascript
纯js实现瀑布流展现照片(自动适应窗口大小)
2013/04/08 Javascript
使用Math.floor与Math.random取随机整数的方法详解
2013/05/07 Javascript
js+css实现tab菜单切换效果的方法
2015/01/20 Javascript
JavaScript插件化开发教程 (一)
2015/01/27 Javascript
JavaScript实现跑马灯抽奖活动实例代码解析与优化(二)
2016/02/16 Javascript
Bootstrap编写一个在当前网页弹出可关闭的对话框 非弹窗
2016/06/30 Javascript
轮播图组件js代码
2016/08/08 Javascript
浅谈js基本数据类型和typeof
2016/08/09 Javascript
javascript函数中的3个高级技巧
2016/09/22 Javascript
javascript 利用arguments实现可变长参数
2016/11/21 Javascript
浅谈Vue的基本应用
2016/12/27 Javascript
Angularjs 动态改变title标题(兼容ios)
2016/12/29 Javascript
JavaScript数组去重算法实例小结
2018/05/07 Javascript
vue中axios的封装问题(简易版拦截,get,post)
2018/06/15 Javascript
详解JavaScript的变量
2019/04/04 Javascript
JS学习笔记之原型链和利用原型实现继承详解
2019/05/29 Javascript
基于Vue中的父子传值问题解决
2020/07/27 Javascript
pygame实现俄罗斯方块游戏
2018/06/26 Python
python增加图像对比度的方法
2019/07/12 Python
python学生信息管理系统实现代码
2019/12/17 Python
window环境pip切换国内源(pip安装异常缓慢的问题)
2019/12/31 Python
使用python执行shell脚本 并动态传参 及subprocess的使用详解
2020/03/06 Python
惠普美国官方商店:HP Official Store
2016/08/28 全球购物
最好的意大利皮夹克:D’Arienzo
2018/12/04 全球购物
前台文员岗位职责
2013/12/28 职场文书
借名购房协议书范本
2014/10/06 职场文书
人事局接收函
2015/01/30 职场文书
银行实习推荐信
2015/03/27 职场文书
2016简历自荐信优秀范文
2016/01/29 职场文书
浅谈Web Storage API的使用
2021/06/23 Javascript
MySQL中的引号和反引号的区别与用法详解
2021/10/24 MySQL
方法汇总:Python 安装第三方库常用
2022/04/26 Python