转自：https://www.cnblogs.com/best/tag/Angular/

AngularJS 通过 ng-directives 扩展了 HTML。

ng-app 指令定义一个 AngularJS 应用程序。

ng-model 指令把元素值（比如输入域的值）绑定到应用程序。

ng-bind 指令把应用程序数据绑定到 HTML 视图。

 <!DOCTYPE html>

 <html>

 <head>

 <meta charset="utf-8">

 <script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script>

 </head>

 <body>

 <div ng-app="">

      <p>名字 : <input type="text" ng-model="name"></p>

      <h1>Hello {{name}}</h1>

 </div>

 </body>

 </html>

实例讲解：

当网页加载完毕，AngularJS 自动开启。

ng-app 指令告诉 AngularJS，<div> 元素是 AngularJS 应用程序 的"所有者"。

ng-model 指令把输入域的值绑定到应用程序变量 name。

ng-bind 指令把应用程序变量 name 绑定到某个段落的 innerHTML。

30.angularJS第一个实例的更多相关文章

  1. 带你走近AngularJS - 体验指令实例

    带你走近AngularJS系列: 带你走近AngularJS - 基本功能介绍 带你走近AngularJS - 体验指令实例 带你走近AngularJS - 创建自定义指令 ------------- ...

  2. Thrift教程初级篇——thrift安装环境变量配置第一个实例

    前言: 因为项目需要跨语言,c++客户端,web服务端,远程调用等需求,所以用到了RPC框架Thrift,刚开始有点虚,第一次接触RPC框架,后来没想到Thrift开发方便上手快,而且性能和稳定性也不 ...

  3. JAVA-MyEclipse第一个实例

    相关资料: <21天学通Java Web开发> 实例代码: MyEclipse第一个实例1.打开MyEclipse程序.2.在PacKage视图->右击->New|Web Pr ...

  4. 小白的springboot之路（一）、环境搭建、第一个实例

    小白的springboot之路(一).环境搭建.第一个实例 0- 前言 Spring boot + spring cloud + vue 的微服务架构技术栈,那简直是爽得不要不要的,怎么爽法,自行度娘 ...

  5. angularjs的resource实例对象

    angularjs的resource实例对象 我们看看都有啥 而直接使用service对象的时候没有前面这些$

  6. 大漠推荐的教程：创建你自己的AngularJS -- 第一部分 Scopes

    创建你自己的AngularJS -- 第一部分 Scopes http://www.html-js.com/article/1863

  7. 【C# -- OpenCV】Emgu CV 第一个实例

    原文 [C# -- OpenCV]Emgu CV 第一个实例 Emgu CV下载地址 http://sourceforge.net/projects/emgucv/files/ 找最新的下就行了,傻瓜 ...

  8. Konckout第一个实例：简单数据模型绑定

    Konck是什么: http://www.aizhengli.com/knockoutjs/50/knockout.html 使用:直接引入knockout.js文件 第一个实例:实现输入框输入值改变 ...

  9. [Angularjs] 第一步开始一个项目

    [Angularjs] 第一步开始一个项目 一.什么是angularjs angularjs是2009年兴起的,目前由Google维护一个采用mvc模式的js框架,很多时候用来创建单页面应用.我也经常 ...

随机推荐

  1. canvas 连线曲线图

    <!DOCTYPE html><html><head> <meta charset="utf-8"> <meta name=& ...

  2. GIT配置多用户

    在公司工作的时候有时候想提交一点代码到github上,然后一台电脑上就需要配置两个账号分别访问github和公司的gitlab 1. 分别生成两个key 为什么要生成两个key的原因我也不清楚,望路过 ...

  3. python_if_else，while,break

    #密码密文展示,getpass在pycharm中无法使用,只能在python中使用import getpass #登录判断'''raw_name="Monica"raw_passw ...

  4. Maven学习总结（22）——Maven常用插件介绍

    我们都知道Maven本质上是一个插件框架,它的核心并不执行任何具体的构建任务,所有这些任务都交给插件来完成,例如编译源代码是由maven- compiler-plugin完成的.进一步说,每个任务对应 ...

  5. Objective-C的陷阱与缺陷

    Objective-C是一个强大而且非常有用的语言,但是同样也是有一点危险的.这次主题是受到一篇有关C++陷阱的文章启发,来聊聊Objective-C和Cocoa中的陷阱. 简介 我将和Horstma ...

  6. iOS 9 适配，我咋还没遇到这么多坑呢呀

    iOS 9 适配,我咋还没遇到这么多坑呢呀 太阳火神的漂亮人生 (http://blog.csdn.net/opengl_es) 本文遵循"署名-非商业用途-保持一致"创作公用协议 ...

  7. IP地址的规划和设计方法(二)

    五,IP地址规划方法           (1)IP地址规划的基本步骤           网络地址规划须要按下面6步进行:           a)推断用户对网络与主机数的需求:           ...

  8. DNS SOA NS区别

    转自 http://bbs.51cto.com/thread-908637-1.html NS服务器里有两个比较重要的记录.一个叫SOA记录(起始授权机构) 一个叫NS(Name Server)记录( ...

  9. vuejs v-bind

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  10. OpenGL编程（一）渲染一个指定颜色的背景窗口

    上次已经搭好了OpenGL编程的环境.已经成功运行了第一个程序.可只是照搬书上的代码,并没弄懂其中的原理.这次通过一个小程序来解释使用GLUT库编写OpenGL程序的过程. 程序的入口 与其他程序一样 ...