主要是描述angularJS如何扩展html的：(模型后面会涉及)
例子1：通过指令来扩展html
<body ng-app="myapp"> <!-- ng-app指令 定义angular的最大控制范围-->
<div ng-init="name=‘luna‘;age=30"> <!-- ng-init指令 可以采用表达式的形式来初始化模型-->
姓名是：<span>{{name}}</span>
年龄是：<span>{{age}}</span> <!-- 表达式可以绑定到html中-->
加法计算： <span>{{ 100 + 10000}}</span>
</div>
<div>
输入价格：<input type="text" ng-model="price"/> <!-- 通过ng-model指令将输入框的值绑定在模型上 -->
</div>
</body>
这个示例子主要是描述了angular表达式和指令是如何使用在html中的。
这些指令是angular跟视图能连接起来的唯一方式，做html设计的设计者可以专注于设计这些html模板。
当然也可以自己定义一个指令：
例子：
var app = angular.module("myApp", []);
app.directive("myDirective", function() {
return {
template : "<h3>自定义指令!</h3>"
};
});
返回的对象中包含
{
restrict : "EA", // 表示 指令可以放在哪些地方
templateUrl : "", // html模板地址
templete : "", // string html模板字符串表示
}
<myDirective></myDirective> 这样就相当于将定义的指令替换在html中。
ng-repeat指令可以遍历数据：
<div ng-app="" ng-init="names=[‘zhaoyang‘,‘john‘,‘chenlong‘]">
<p>使用 ng-repeat 来循环数组</p>
<ul>
<li ng-repeat="x in names"> {{ x }}
</li>
</ul>
</div>
原文：https://www.cnblogs.com/999-ganmaoling/p/11830776.html