我已经仔细阅读了AngularJS关于这个主题的文档，然后摆弄了一个指令。这是小提琴。
以下是一些相关片段:
来自HTML: <窗格bi-title = "标题" title =“{{标题}}>{{文本}}> < /窗格 从窗格指令: scope: {biTitle: '='， title: '@'， bar: '='}，
有几件事我不明白:
为什么我必须使用“{{title}}”与“@”和“title”与“=”? 我也可以直接访问父范围，而不装饰我的元素与属性? 文档说:“通常情况下，通过表达式将数据从孤立的作用域传递到父作用域是可取的”，但这似乎也适用于双向绑定。为什么表达式路由会更好呢?
我发现另一个小提琴，显示表达式解决方案太:http://jsfiddle.net/maxisam/QrCXh/
当前回答
为什么我必须使用“{{title}}”与“@”和“title”与“=”?
当你使用{{title}}时，只有父范围值将被传递给指令视图并计算。这仅限于一种方式，这意味着更改不会反映在父范围中。当你想要将在子指令中所做的更改反映到父作用域时，你也可以使用'='。这是双向的。
我也可以直接访问父范围，而不装饰我 元素的属性?
当指令中有scope属性(scope:{})时，你将不能再直接访问父作用域。但是仍然可以通过作用域访问它。美元的父母等等。如果从指令中删除作用域，则可以直接访问它。
文档中说:“通常需要从 隔离作用域通过表达式和父作用域”，但是 似乎工作与双向绑定也很好。为什么 表达路线更好吗?
这取决于上下文。如果你想调用带有数据的表达式或函数，你可以使用&，如果你想共享数据，你可以使用双向的方式使用'='
你可以在下面的链接中找到传递数据到指令的多种方式之间的差异:
AngularJS -隔离作用域- @ vs = vs &
http://www.codeforeach.com/angularjs/angularjs-isolated-scopes-vs-vs
其他回答
为什么我必须使用“{{title}}”与“@”和“title”与“=”?
当你使用{{title}}时，只有父范围值将被传递给指令视图并计算。这仅限于一种方式，这意味着更改不会反映在父范围中。当你想要将在子指令中所做的更改反映到父作用域时，你也可以使用'='。这是双向的。
我也可以直接访问父范围，而不装饰我 元素的属性?
当指令中有scope属性(scope:{})时，你将不能再直接访问父作用域。但是仍然可以通过作用域访问它。美元的父母等等。如果从指令中删除作用域，则可以直接访问它。
文档中说:“通常需要从 隔离作用域通过表达式和父作用域”，但是 似乎工作与双向绑定也很好。为什么 表达路线更好吗?
这取决于上下文。如果你想调用带有数据的表达式或函数，你可以使用&，如果你想共享数据，你可以使用双向的方式使用'='
你可以在下面的链接中找到传递数据到指令的多种方式之间的差异:
AngularJS -隔离作用域- @ vs = vs &
http://www.codeforeach.com/angularjs/angularjs-isolated-scopes-vs-vs
他们之间的主要区别是
@ Attribute string binding
= Two-way model binding
& Callback method binding
=表示双向绑定，即父作用域的变量引用。这意味着，当你在指令中改变变量时，它也会在父作用域中被改变。
@意味着变量将被复制(克隆)到指令中。
据我所知，<pane bi-title="{{title}}" title="{{title}}">{{text}}</pane>也应该工作。Bi-title将接收父范围变量值，该值可以在指令中更改。
如果你需要改变父作用域中的几个变量，你可以在指令内执行父作用域中的函数(或者通过服务传递数据)。
我创建了一个小的HTML文件，里面有Angular代码来演示它们之间的区别:
<!DOCTYPE html>
<html>
<head>
<title>Angular</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script>
</head>
<body ng-app="myApp">
<div ng-controller="myCtrl as VM">
<a my-dir
attr1="VM.sayHi('Juan')" <!-- scope: "=" -->
attr2="VM.sayHi('Juan')" <!-- scope: "@" -->
attr3="VM.sayHi('Juan')" <!-- scope: "&" -->
></a>
</div>
<script>
angular.module("myApp", [])
.controller("myCtrl", [function(){
var vm = this;
vm.sayHi = function(name){
return ("Hey there, " + name);
}
}])
.directive("myDir", [function(){
return {
scope: {
attr1: "=",
attr2: "@",
attr3: "&"
},
link: function(scope){
console.log(scope.attr1); // =, logs "Hey there, Juan"
console.log(scope.attr2); // @, logs "VM.sayHi('Juan')"
console.log(scope.attr3); // &, logs "function (a){return h(c,a)}"
console.log(scope.attr3()); // &, logs "Hey there, Juan"
}
}
}]);
</script>
</body>
</html>
@将局部/指令作用域属性绑定到DOM属性的评估值。 =将局部/指令作用域属性绑定到父作用域属性。 & binding用于将方法传递到指令的作用域，以便在指令中调用它。
@属性字符串绑定 =双向模型绑定 &回调方法绑定
