以写一个hello word为例，首先引入angular.js库文件

 
<!doctype html>

<html ng-app>

   <head>

        <title>angular应用demo</title>

        <script src="angular.js"></script>

  </head>

  <body>

   <input ng-model="name" type="text" value="hello word" />

   <div>{{ name }}</div>

  </body>

</html>
 

代码解读:

  • 通过指定在html(也可以在任意dom)中加入ng-app属性，ng-app属性声明所有被其包含的内容都属于这个angularJS应用,只有被ng-app属性的dom元素包含的元素才受到angularJS的影响
  • 一个页面中只能声明一个ng-app,只识别第一个ng-app其余无效
  • ng-model内部指令将内部数据模型对象$scope的name属性绑定到了文本输入字段上
  • {{ name }}输出内部数据模型对象$scope的name属性值到div标签中

如何搭建一个angularJS应用的更多相关文章

  1. 使用Yeoman搭建 AngularJS 应用 (12) —— 让我们搭建一个网页应用

    原文地址:http://yeoman.io/codelab/local-storage.html 安装Bower程序包 我们使用另一个Angular模块,"angular-local-sto ...

  2. Angularjs,WebAPI 搭建一个简易权限管理系统

    Angularjs,WebAPI 搭建一个简易权限管理系统 Angularjs名词与概念(一)   1. 目录 前言 Angularjs名词与概念 权限系统原型 权限系统业务 数据库设计和实现 Web ...

  3. Angularjs,WebAPI 搭建一个简易权限管理系统 —— Angularjs 前端主体结构(五)

    目录 前言 Angularjs名词与概念 Angularjs 基本功能演示 系统业务与实现 WebAPI项目主体结构 Angularjs 前端主体结构 6 Angularjs 前端主体结构 6.1 A ...

  4. 使用Yeoman搭建 AngularJS 应用 (4) —— 让我们搭建一个网页应用

    在开发一个的网页传统工作流程中,你需要大量的时间去设置引用文件,下载依赖文件,并且手动的创建网页文件结构.Yeoman生成器将会帮助你完成这些.让我们安装一个AngularJS项目的生成器. 安装An ...

  5. 使用Yeoman搭建 AngularJS 应用 (2) —— 让我们搭建一个网页应用

    原文地址:http://yeoman.io/codelab/index.html 使用Yeoman搭建简单的应用 今天将会搭建一个简单的网页程序.你将可以添加,删除,拖拽和保存. 浏览Yeoman Y ...

  6. 通过ProGet搭建一个内部的Nuget服务器

    .NET Core项目完全使用Nuget 管理组件之间的依赖关系,Nuget已经成为.NET 生态系统中不可或缺的一个组件,从项目角度,将项目中各种组件的引用统统交给NuGet,添加组件/删除组件/以 ...

  7. 基于hexo+github搭建一个独立博客

    一直听说用hexo搭建一个拥有自己域名的博客是很酷炫的事情~,在这十一花上半个小时整个hexo博客岂不美哉. 使用Hexo吸引我的是,其简单优雅, 而且风格多变, 适合程序员搭建个人博客,而且支持多平 ...

  8. NodeJS 最快速搭建一个HttpServer

    最快速搭建一个HttpServer 在目录里放一个index.html cd D:\Web\InternalWeb start http-server -i -p 8081

  9. 【日记】搭建一个node本地服务器

    用node搭建一个本地http服务器.首先了解htpp服务器原理 HTTP协议定义Web客户端如何从Web服务器请求Web页面,以及服务器如何把Web页面传送给客户端.HTTP协议采用了请求/响应模型 ...

随机推荐

  1. 控件treeview使用

    一:实现功能,获得选中节点,在选中节点下添加节点,折叠,展开,删除,得到选中节点下checked项,选中根节点其下节点也选中,图标.上图 二:相关代码 using System; using Syst ...

  2. 代码审查工具之PMD操作指南

    上周客户要求对OA系统的代码质量进行了一个整体审查,并且要出一份报告给领导. 为此花了半天时间把代码审查工具PMD琢磨了下,现将具体操作步骤描述如下,以供大家参考! 1 前言 质量是衡量一个软件是否成 ...

  3. E - Find The Multiple

    题目大意 找倍数 给你一个数,找到一个能数是它的倍数的数,当然这个数只能由0和1组成.......这个数最大200,比较唬人,其实这个数在最大也不超过2^64.....简单广搜一下 ///////// ...

  4. awr报告

    BEGIN DBMS_WORKLOAD_REPOSITORY.CREATE_SNAPSHOT();END;/ exec DBMS_WORKLOAD_REPOSITORY.CREATE_SNAPSHOT ...

  5. 小学生玩ACM----深搜

    Square Time Limit: 10000/5000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others) Total Su ...

  6. Bloom Filter 原理与应用

    介绍 Bloom Filter是一种简单的节省空间的随机化的数据结构,支持用户查询的集合.一般我们使用STL的std::set, stdext::hash_set,std::set是用红黑树实现的,s ...

  7. Android数据存储(1)少量数据保存之SharedPreferences接口实例

    SharedPreferences数据保存主要是通过键值的方式存储在xml文件中 xml文件在data/此程序的包名/XX.xml 格式 <?xml version='1.0' encoding ...

  8. [TypeScript] Inheritance

    Inheritance is a way toindicate that a class receives behavior from a parent class. Then we can over ...

  9. .ignore插件自动忽略

    AS自带的.ignore文件 在AS中新建项目时,默认会创建一个.ignore文件,其中默认忽略的是 *.iml .gradle /local.properties /.idea/workspace. ...

  10. 关于 rem 作为单位设置大小

    rem是相对长度单位.相对于根元素(即html元素)font-size计算值的倍数htm{font-size: 62.5%;}根元素(html)先设置一个font-size,一般情况下为了容易计算re ...