本文将带你了解WEBAPP开发之- AngularJS 指令，希望本文对大家学WEBAPP有所帮助。

指令就是用来创建自定义元素的，用.directive()创建
假设现在有如下HTML元素
//自定义元素


下面就是这个标签所执行js代码，
//myDirective看起来的指令像这样的
angular.module('myApp',[])

.directive('myDirective',function(){
return{
restrict:'E',
template:'
ClickmetogotoGoogle'
});
};
});


调用指令意味着执行指令背后与之相关联的代码，这些代码是我们用指令定义写出来的
上面的执行效果，如图：







因为AngularJS中，指令都是由.directive()方法创建的，所以下面主要说说.directive()的用法
1.声明指令的格式##
创建指令前是需要声明指令，也就是类似于这个


声明的指令有格式要求，以下是合法格式
//元素
//属性
//样式
//注释

AngularJS通过restrict属性，去修改指令的定义，例如上面例子中看到的，restrict:'E'
另外还可以指定元素（E）属性（A）类（C）注释（M）的格式
AngularJS官方建议我们用属性的方式去声明，因为对于浏览器有着比较好的兼容性。
2.指令中传递数据##
下面的双向绑定过程的源代码。







TheirURLfield:

<divmy-directive
some-attr="theirUrl"
my-link-text="ClickmetogotoGoogle">

下面这一段是执行之后，实际的代码


TheirURLfield:



看执行完后的过程，实际上，
下面开始分析过程
1，声明元素，并添加两个属性some-attr，my-link-text，值为"theirUrl"，"ClickmetogotoGoogle"
<divmy-directive
some-attr="theirUrl"
my-link-text="ClickmetogotoGoogle">


2，利用.directive()创建指令,利用隔离作用域，将指令的私有属性$scope.myUrl,$scope.myLinkText,绑定起来
也就是说，

本文由职坐标整理并发布，希望对同学们有所帮助。了解更多详情请关注职坐标移动开发之WebApp频道！