AngularJS 通过被称为 指令 的新属性来扩展 HTML。
AngularJS 通过内置的指令来为应用添加功能。
AngularJS 允许你自定义指令。

AngularJS 指令是扩展的 HTML 属性，带有前缀 ng-

ng-app

指令初始化一个 AngularJS 应用程序。，标记AngularJs的范围，这个范围内AngularJs可以识别。一般放在html标签里，整个html一个就好，多了也只是第一个有作用，值一般不要为空。

ng-init

指令初始化应用程序数据，基本写法就是ng-init=”xxx=’xxx’”，有多个元素的时候，以”;”间隔

@H_403_29@<div ng-init="name='HAHA';age='100'"> @H_403_29@<p>姓名：{{name}}，年龄：{{age}}@H_403_29@</p> <!--显示:姓名：HAHA，年龄：100--> @H_403_29@</div>

ng-model

指令把元素值（比如输入域的值）绑定到应用程序。

@H_403_29@<div ng-init="name='HAHA';age='100'"> @H_403_29@<p>姓名：{{name}}，年龄：{{age}}@H_403_29@</p> @H_403_29@<input ng-model="name">@H_403_29@</input> @H_403_29@</div>

ng-bind

这个指令也是用来绑定数据。

@H_403_29@<div ng-init="name='HAHHA'">
  @H_403_29@<p ng-bind="name">@H_403_29@</p>
@H_403_29@</div>

ng-model是用于表单元素的，支持双向绑定。对普通元素无效；
ng-bind用于普通元素，不能用于表单元素
当ng-bind和{{}}同时使用时，ng-bind绑定的值覆盖该元素的内容。

@H_403_29@<div ng-init="name='HAHHA';age='122'"> @H_403_29@<p ng-bind="age">{{name}}@H_403_29@</p> @H_403_29@</div> 这个最后只会显示122

ng-repeat

指令对于集合中（数组中）的每个项会 克隆一次 HTML 元素。看一下列子。

从图上可以看出，是创建了2个ul,然后数据显示在li上，可以加个背景颜色看一下

html:

 @H_403_29@<div ng-controller="MainController"> @H_403_29@<ul ng-repeat="m in emails"> @H_403_29@<li>{{$index+1}}:@H_403_29@</li> @H_403_29@<li>{{m.id}}@H_403_29@</li> @H_403_29@<li>{{m.name}}@H_403_29@</li> @H_403_29@<li>{{m.message}}@H_403_29@</li> @H_403_29@</ul> @H_403_29@</div>

js

//邮件
  var messages=[{
    id:100,name:@H_983_301@"哈哈哈",message:@H_983_301@"今天星期五啊，明天不上班。"
  },{
    id:300,name:@H_983_301@"猪八戒",message:@H_983_301@"约了师兄逛公园"
  }];
  app.controller(@H_983_301@'MainController',function($scope){
    console.log(messages);
    $scope.emails =messages;
  });

自定义指令

app.directive(@H_983_301@'myDirective',function(){
    return{
      template:@H_983_301@"<p>这是一个自定义指令</p>"
    }

  });

使用的时候可以这样的使用，会输出 这是一个自定义指令

@H_403_29@<my-directive>@H_403_29@</my-directive>

有关指令的使用有多种方法，具体通过restrict 的值来判断

app.directive(@H_983_301@'myDirective',function(){
    return{
      restrict : @H_983_301@"E",//元素名使用
      template:@H_983_301@"<p>这是一个自定义指令</p>"
    }

  });

1.作为元素名使用

restrict : @H_983_301@"E",//元素名使用
<my-directive></my-directive>

2.作为属性使用

restrict : @H_983_301@"A",//属性使用
<div my-directive></div>

3.作为类名使用

restrict : @H_983_301@"C",//类名使用
<div class=@H_983_301@"my-directive"></div>

4.作为注释使用

restrict : "M",//作为注释名使用
  replace : true//这个要加上否则注释使用没效果
<!-- directive:my-directive -->

指令的名称是区分大小写的。大家可以试试指令名称是myDDirective的时候用什么方式才会有效。

以上，不对的地方请指出谢谢