自己对于=绑定的理解
把代码改动了下便于自己理解概念
<html ng-app='expanderModule'>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="ExpanderSimple.css"/>
<script src="framework/angular-1.3.0.14/angular.js"></script>
<script src="ExpanderSimple.js"></script>
</head>
<body>
<div ng-controller='SomeController'>
<h1>{{title}}</h1>
<expander class='expander' title1='title'>
{{text}}
</expander>
</div>
</body>
</html> var expanderModule=angular.module('expanderModule', []);
expanderModule.directive('expander', function() {
return {
restrict : 'EA',
replace : true,
transclude : true,
scope : {
title1 : '='
},
template : '<div>'
+ '<div class="title" ng-click="toggle()">{{title1}}</div>'
+ '<div class="body" ng-show="showMe" ng-transclude></div>'
+ '</div>',
link : function(scope, element, attrs) {
scope.showMe = false;
scope.toggle = function() {
scope.showMe = !scope.showMe;
scope.showMe ? scope.title1 = "点击收起" : scope.title1 = "点击展开";
}
}
}
});
expanderModule.controller('SomeController',function($scope) {
$scope.title = '点击展开';
$scope.text = '这里是内部的内容。';
});我的理解,=绑定更像是c里面的指针。传的是指向变量的地址。
缺省只写等号,应该是表示同名,这里的同名是指,指令里的属性名称,和独立scope对象里的属性名称相同。
和$scope的属性名无关。
template中的{{title1}}指的是独立scope中的title1。