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. 深入理解计算机系统chapter8

    进程轮流使用处理器 父进程调用fork来创建一个新的子进程 回收子进程 waitpid/wait 非本地跳转:

  2. 巧用Mono.Cecil反射加载类型和方法信息

    最近在做服务的细粒度治理,统一管理所有服务的方法.参数.返回值信息.方便后续的各个模块之间的对接和协作. 目前系统中所有的服务,管理到接口契约粒度,即服务接口声明和服务接口实现.要做服务的细粒度治理: ...

  3. bzoj2730（矿场搭建）

    矿场搭建,不知道为什么,莫名其妙T了在212上,额,zyh数据真的坑. bzoj200轻松跑过啊. 就是点双联通分量缩点,然后标记割点,一个块如果有>=2个割点,则不需要挖矿洞, 如果只有一割点 ...

  4. HDU-2222文字检索

    题目: In the modern time, Search engine came into the life of everybody like Google, Baidu, etc. Wiske ...

  5. 访问 IIS 元数据库失败

    问题: 访问 IIS 元数据库失败.说明: 执行当前 Web 请求期间,出现未处理的异常.请检查堆栈跟踪信息,以了解有关该错误以及代码中导致错误的出处的详细信息. 异常详细信息: System.Web ...

  6. 浅谈PHP7的新特性

    我以前用过的php的最高版本是php5.6.在换新工作之后,公司使用的是PHP7.据说PHP7的性能比之前提高很多.下面整理下php7的新特性.力求简单了解.不做深入研究. 1.变量类型声明 函数的参 ...

  7. android中跨线程向控件传值的问题

    activity.oncreate(bundle savedinstancestate)中创建一个handler类的实例, 在这个handler实例的handlemessage回调函数中调用更新界面显 ...

  8. 干货,比较全面的c#.net公共帮助类

    比较全面的c#帮助类 比较全面的c#帮助类,日常工作收集,包括前面几家公司用到的,各式各样的几乎都能找到,所有功能性代码都是独立的类,类与类之间没有联系,可以单独引用至项目,分享出来,方便大家,几乎都 ...

  9. JS实现数组每次只显示5条数据

    var array = [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16]; //循环样式结构function fun(arr,index){ var str = &qu ...

  10. springboot kafka集成(实现producer和consumer)

    本文介绍如何在springboot项目中集成kafka收发message. 1.先解决依赖 springboot相关的依赖我们就不提了,和kafka相关的只依赖一个spring-kafka集成包 &l ...