angular入门（基础篇）
一、什么是AngularJs？
AngularJs是一个JavaScript框架，通过指令扩展了HTML,并且通过表达式绑定数据到HTML.
AngularJs使得开发现代的单页面应用程序(SPA:Single Page Applications)变得更加简单，并且其避免了js中的DOM操作，使得加载速度大大加快。
二、Angular入手模板框架搭建
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript" src="angular.min.js"></script>
</head>
<body ng-app = "app" ng-controller='myVC'>
</body>
<script>
var app = angular.module('app',[]).controller('myVC',function($scope){};
</script>
</html>
AngularJS 模块（Module） 定义了 AngularJS 应用。
AngularJS 控制器（Controller） 用于控制 AngularJS 应用。
ng-app指令定义了应用,也就是angular指令有效的作用域, ng-controller 定义了控制器，一个作用域内可以定义多个控制器。
三、Angular常用指令及用法
ng-app 指令初始化一个 AngularJS 应用程序。
ng-init 指令初始化应用程序数据：
<div ng-app="" ng-init="names=['Jani','Hege','Kai']"> </div>
ng-model 指令把元素值（比如输入域的值）绑定到应用程序，{{ name }} 是通过 ng-model="name" 进行同步。
<input type="number" ng-model="quantity">
<p>{{quantity}}</p>
ng-repeat 指令会重复一个 HTML 元素：
<li ng-repeat="x in names">
{{ x }}
</li>
.directive 函数来添加自定义的指令:
注：使用驼峰法来命名一个指令， runoobDirective, 但在使用它时需要以 - 分割, runoob-directive，返回的参数 ——template:html代码。
<body ng-app="myApp"> <runoob-directive></runoob-directive> <script>
var app = angular.module("myApp", []);
app.directive("runoobDirective", function() {
return {
template : "<h1>自定义指令!</h1>"
};
});
</script>
angular入门（基础篇）的更多相关文章
- Linux入门基础篇
Linux入门基础篇 Linux诞生 Linux发行版本说明 Linux官方网站 Linux内核官方网站 比较有名的Linux发行版 虚拟机(Virtual Machine),一个虚拟的系统,安装在系 ...
- 智普教育Python视频教程之入门基础篇,python笔记
智普教育Python视频教程之入门基础篇,python笔记 print id()内存地址 type()变量类型 windows命令行下edit命令 python数据类型不需要指定类型 定义hostna ...
- Java正则表达式入门基础篇
正则表达式是一种可以用于模式匹配和替换的规范,一个正则表达式就是由普通的字符(例如字符a到z)以及特殊字符(元字符)组成的文字模式,它 用以描述在查找文字主体时待匹配的一个或多个字符串.正则表达式作为 ...
- object-c 入门基础篇
原地址:http://www.cnblogs.com/moonvan/archive/2011/10/13/2210498.html 一.Objective-C与C的渊源 Objective-C诞生于 ...
- CSS快速入门基础篇，让你快速上手（附带代码案例）
1.什么是CSS 学习思路 CSS是什么 怎么去用CSS(快速上手) CSS选择器(难点也是重点) 网页美化(文字,阴影,超链接,列表,渐变等) 盒子模型 浮动 定位 网页动画(特效效果) 项目格式: ...
- 牛客SQL刷题第一趴——非技术入门基础篇
user_profile表: id device_id gender age university province 1 2138 male 21 北京大学 Beijing 2 3214 male ...
- React入门----基础篇
React 背景介绍 React 起源于 Facebook 的内部项目,因为该公司对市场上所有 JavaScript MVC 框架,都不满意,就决定自己写一套,用来架设 Instagram 的网站.做 ...
- Java入门到精通——基础篇之多线程实现简单的PV操作的进程同步
Java入门到精通——基础篇之多线程实现简单的PV操作的进程同步 一.概述 PV操作是对信号量进行的操作. 进程同步是指在并发进程之间存在一种制约关系,一个进程的执行依赖另一个进程的消 ...
- Qt入门之基础篇 ( 二 ) ：Qt项目建立、编译、运行和发布过程解析
转载请注明出处:CN_Simo. 题解: 本篇内容主讲Qt应用从创建到发布的整个过程,旨在帮助读者能够快速走进Qt的世界. 本来计划是讲解Qt源码静态编译,如此的话读者可能并不能清楚地知道为何要静态编 ...
- Qt入门之基础篇（三）：掌握Qt4的静态编译基本方法
转载载请注明出处:CN_Simo. 导语: 前两章都提到过“静态编译”(Static Compilation),在Windows下一次静态编译差不多需要长达三个小时才能完成,而且还非常容易由于各种原因 ...
随机推荐
- javascript面向对象编程，带你认识封装、继承和多态
原文链接:点我 周末的时候深入的了解了下javascript的面向对象编程思想,收获颇丰,感觉对面向对象编程有了那么一丢丢的了解了~很开森 什么是面向对象编程 先上一张图,可以对面向对象有一个大致的了 ...
- 紫书 例题 10-29 UVa 1642（最优连续子序列）
这类求最优连续子序列的题一般是枚举右端点,然后根据题目要求更新左端点, 一般是nlogn,右端点枚举是n,左端点是logn 难点在于如何更新左端点 用一些例子试一下可以发现 每次加进一个新元素的时候 ...
- [CQOI2013]新Nim游戏（线性基）
P4301 [CQOI2013]新Nim游戏 题目描述 传统的Nim游戏是这样的:有一些火柴堆,每堆都有若干根火柴(不同堆的火柴数量可以不同).两个游戏者轮流操作,每次可以选一个火柴堆拿走若干根火柴. ...
- Zookeeper入门：基本概念、5项配置、启动
起源 最早接触Zookeeper,是在学习Hadoop权威指南这本书的时候,印象中是Hadoop项目的一个子工程. 最近,项目中需要用到"分布式锁". 之前,在 ...
- IDEA修改当前工程jdk版本
1.ctrl+shift+alt+s 2.根据实际情况修改jdk版本
- ArcGIS api for javascript——地理处理任务-计算一个可视域
描述 本例展示了使用一个地理处理计算一个可视域(viewshed) 单击地图上的任意点查看该点5英里内能看见的所有区域.这个模型需要几秒钟来运行并反馈结果. 可视域计算是通过ArcGIS Server ...
- 【 D3.js 入门系列 --- 2.1 】 关于怎样选择，插入，删除元素
本人的个人博客首页为: http://www.ourd3js.com/ ,csdn博客首页为:http://blog.csdn.net/lzhlzz/. 转载请注明出处,谢谢. 在D3.js中,选择 ...
- LeetCode_Construct Binary Tree from Inorder and Postorder Traversal
一.题目 Construct Binary Tree from Inorder and Postorder Traversal My Submissions Given inorder and pos ...
- 记一次httpclient Connection reset问题定位
问题:某业务系统在运行一段时间后,某个API一定概率偶现Connection reset现象. 问题定位: 首先想到的是要本地复现出这个问题,但一直复现不出来. 1.根据线上问题相关日志判断应该是有部 ...
- BZOJ 1577 贪心
思路:同POJ3038 http://blog.csdn.net/qq_31785871/article/details/52953214 //By SiriusRen #include <se ...