AngularJS ng-model 指令

ng-model 指令用于绑定应用程序数据到 HTML 控制器(input, select, textarea)的值。

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<script src="https://cdn.static.runoob.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

    $scope.name = "John Doe";

});

</script>

<p>修改输入框的值，标题的名字也会相应修改。</p>

</body>

</html>

AngularJS学习篇（四）的更多相关文章

  1. angularjs学习第四天笔记（第一篇：简单的表单验证）

    您好,我是一名后端开发工程师,由于工作需要,现在系统的从0开始学习前端js框架之angular,每天把学习的一些心得分享出来,如果有什么说的不对的地方,请多多指正,多多包涵我这个前端菜鸟,欢迎大家的点 ...

  2. AngularJS学习篇（二十四）

    AngularJS 应用 <html ng-app="myNoteApp"> <head> <meta charset="utf-8&quo ...

  3. AngularJS学习篇（十四）

    AngularJS 事件 ng-click 指令 ng-click 指令定义了 AngularJS 点击事件. <!DOCTYPE html> <html> <head& ...

  4. AngularJS学习篇（二十三）

    AngularJS 路由 AngularJS 路由允许我们通过不同的 URL 访问不同的内容. 通过 AngularJS 可以实现多视图的单页Web应用(single page web applica ...

  5. AngularJS学习篇（二十二）

    AngularJS 依赖注入 什么是依赖注入 wiki 上的解释是:依赖注入(Dependency Injection,简称DI)是一种软件设计模式,在这种模式下,一个或更多的依赖(或服务)被注入(或 ...

  6. AngularJS学习篇（二十一）

    AngularJS 动画 AngularJS 提供了动画效果,可以配合 CSS 使用. AngularJS 使用动画需要引入 angular-animate.min.js 库. <!doctyp ...

  7. AngularJS学习篇（二十）

    AngularJS 包含 在 AngularJS 中,你可以在 HTML 中包含 HTML 文件. 使用 AngularJS, 你可以使用 ng-include 指令来包含 HTML 内容: < ...

  8. AngularJS学习篇（十九）

    AngularJS Bootstrap 可以在你的 AngularJS 应用中加入 Twitter Bootstrap,你可以在你的 <head>元素中添加如下代码: <link r ...

  9. AngularJS学习篇（十八）

    AngularJS API AngularJS 全局 API 用于执行常见任务的 JavaScript 函数集合,如: 比较对象 迭代对象 转换对象 全局 API 函数使用 angular 对象进行访 ...

随机推荐

  1. 转自知乎（JAVA后台开发可以纯粹用JAVA SE吗？）

    著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明出处.作者:巴多崽链接:http://www.zhihu.com/question/29663744/answer/45154839来源: ...

  2. 反射结合xml简单的模拟spring创建bean

    框架最底层其实就是通过反射实现的,就像spring,当你配置各种各样的bean时都是以配置文件的形式配置的,你需要用到哪些bean就配哪些,spring容器就会根据你的需求去动态加载,这儿写一个简单的 ...

  3. AFN默认请求和响应的处理

       1.默认的响应的解析      1.1 AFN默认不支持接受text/html数据类型,只需要增加即可     manager.responseSerializer.acceptableCont ...

  4. Hadoop安全（2）——————UserGroupInformation

    UserGroupInformation保存hadoop用户及组信息 此类包装JAAS Subject,并提供确定用户的用户名和组的方法.它支持Windows,Unix和Kerberos登录模块.

  5. Linux入门之常用命令（1）

    退出系统 exit 图形界面 startx 时间 date 日历 cal [month] [year] 计算器 bc 帮助 man [command]  // info [command] 在线用户 ...

  6. web.xml中servlet-mapping的配置

    <servlet-mapping>元素在Servlet和URL样式之间定义一个映射.它包含了两个子元素<servlet- name>和<url-pattern>,& ...

  7. 插入排序的性能测试对比（C与C++实现）

    一.概述: [标题]学生成绩管理的设计与实现 [开发语言]C.C++ [主要技术]结构体.STL [基本功能]实现对学生成绩类的基本操作:增加.删除.查询.排序 [测试数据]功能测试:按提示输入5组正 ...

  8. 移动端效果之Swiper

    写在前面 最近在做移动端方面运用到了饿了么的vue前端组件库,因为不想单纯用组件而使用它,故想深入了解一下实现原理.后续将会继续研究一下其他的组件实现原理,有兴趣的可以关注下. 代码在这里:戳我 1. ...

  9. 网站常用的一些javascript封装 简化调用

    //用于网页地址参数 //参数中包含出了英文中文数字之外的其他符号时进行编码并在前面加"=="进行标识,否则直接返回 //解码时根据是否含有"=="标识来决定是 ...

  10. http服务详解（1）——一次完整的http服务请求处理过程

    前言:要熟练掌握一个服务,首先需要非常了解这个服务的工作过程,这篇就详细解释了http服务的请求处理过程. 一次完整的http请求处理过程 (1)流程图 (2)过程详解 0.DNS域名解析:递归查询. ...