HTML在构建应用（App）时存在诸多不足之处，AngularJS通过扩展一系列的HTML属性或标签来弥补这些缺陷，
所谓指令就是AngularJS自定义的HTML属性或标签，这些指令都是以ng-做为前缀的，例如ng-app、ng-controller、ng-repeat等。
-
内置指令:
- ng-app 指定应用根元素,至少有一个
- ng-controller 指定控制器
- ng-show 控制器元素是否显示, true显示、false不显示
- ng-hide控制元素是否隐藏，true隐藏、false不隐藏
- ng-if控制元素是否“存在”，true存在、false不存在
- ng-src增强图片路径
- ng-href增强地址
- ng-class控制类名
- ng-include引入模板
- ng-disabled表单禁用
- ng-readonly表单只读
- ng-checked单/复选框表单选中
- ng-selected下拉框表单选中
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<script src="js/angular.js"></script>
<script>
//1.创建模块
var app = angular.module('app', []);
//2.创建控制器
app.controller('xmgController', ['$scope', function ($scope) {
$scope.name = "p标签 p标签";
$scope.msg = "h1标签";
$scope.course = ['html', 'css', 'js'];
$scope.stu = [
{name:'zs', no:'11'},
{name:'ls', no:'22'},
{name:'wc', no:'38'}
];
}]);
//3.绑定模块 ng-app="app"
//4.绑定控制器
</script>
<!--3.绑定模块 ng-app="app"-->
<body ng-app="app" ng-controller="xmgController">
<div>
<p>{{name}}</p>
</div>
<div>
<h1>{{msg}}</h1>
</div>
<div>
<ul>
<!--指令：angular给原生的html标签添加一些新属性，达到自己指定的功能-->
<!--所有指令都以ng-开头-->
<!--遍历-->
<!--<li ng-repeat="(key, value) in course">{{key}}-{{value}}</li>-->
<li ng-repeat="value in course">{{value}}</li>
</ul>
<ul>
<li ng-repeat="per in stu">{{per.name}}-{{per.no}}</li>
</ul>
</div>
</body>
</html>
