用angularJS做框架开发也有一段时间了，一开始一直搞不清指令和控制器是如何交互的。后来查阅了诸多资料，借鉴了很多开发前辈的资料，对他们之间是如何交互也理清了一点头绪，现在简单分享一下，如果有说的不对的地方还请诸位前辈指教
在这里，我仅仅以AngularJS 指令中的‘@’来做解释。
先给出静态页面（因为写的比较简单，所以我就省略了样式）：
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>Title</title>
<meta charset="utf-8"/>
<link rel="stylesheet" href="css/test.css"/>
<script type="text/javascript" src="vendor/angular/angular.js"></script>
</head>
<body ng-app="myModule">
<div ng-controller="myController">
<span> 这是个demo。后面是测试结果：</span>
<my-test attr="{{value}}"></my-test>
</div>
<script type="text/javascript" src="js/test.js"></script>
</body>
</html>
test.js：
var myNodule = angular.module('myModule',[]);
myNodule.controller('myController',['$scope',function($scope){
$scope.value = "Gecko";
}]);
myNodule.directive('myTest',function(){
return{
restrict:'E',
scope:{
attr:'@'
},
template:'<span>{{attr}}</span>'
}
});给出结果：
我理解的指令和控制器的交互原理大致分为三步：
1. 指令通过‘@’实现与HTML页面元素的关联；
2. 控制器中又通过$scope实现了与页面元素的联系；
3. 从而借助HTML页面。建立起了指令与控制器之间的联系。
不知道自己理解的对不对，如果理解的不对，欢迎前辈指教更正。也欢迎大家与我一起交流Angular的知识~谢谢！