转自：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. Artisan 命令

    php artisan key:generate 生成 App Key php artisan make:controller 生成控制器 php artisan make:model 生成模型 ph ...

  2. WPF打字机效果

    public partial class MainWindow : Window { public MainWindow() { InitializeComponent(); TypewriteTex ...

  3. C#-反射知识点

    1.反射是基于Sytem.Type的,里面的很多方法是system.reflection里面的 MethodInfo[] tt= t.GetType().GetMethods(); //t是strin ...

  4. Fedora 17 安裝完全指南

    Fedora 17 关闭U盘自动mount gsettings set org.gnome.desktop.media-handling automount "false" gse ...

  5. @SpringBootApplication cannot be resolved to a type In STS

    @SpringBootApplication cannot be resolved to a type In STS 学习了:https://stackoverflow.com/questions/4 ...

  6. HDOJ 5008 Boring String Problem

    后缀数组+RMQ+二分 后缀数组二分确定第K不同子串的位置 , 二分LCP确定可选的区间范围 , RMQ求范围内最小的sa Boring String Problem Time Limit: 6000 ...

  7. 一步一步跟我学习lucene（19）---lucene增量更新和NRT(near-real-time)Query近实时查询

    这两天加班,不能兼顾博客的更新.请大家见谅. 有时候我们创建完索引之后,数据源可能有更新的内容.而我们又想像数据库那样能直接体如今查询中.这里就是我们所说的增量索引.对于这种需求我们怎么来实现呢?lu ...

  8. Double Vision （Unity 5.0）

    Double Vision (Unity 5.0): 根据 http://http.developer.nvidia.com/CgTutorial/cg_tutorial_chapter03.html ...

  9. c# 枚举enum

    1 定义枚举 enum Days { Sunday, Monday, Tuesday, Wednesday, Thursday, Friday, Saturday }; 默认情况下,枚举中的每个元素的 ...

  10. ES6学习4 变量的解构赋值

    变量的解构赋值 一.数组结构赋值 1.数组结构赋值 let [a, b, c] = [1, 2, 3]; ES6 可以从数组中提取值,按照对应位置,对变量赋值. 1)  本质上,这种写法属于“模式匹配 ...