首先在书上的例子:
<div ng-cont rol l er=' SomeCont rol l er' >
<expander cl ass=' expander' expander-t i t l e=' t i t l e' >
{{t ext }}
</ expander>
</ di v>
angular. modul e(' expanderModul e' , [ ] )
. di rect i ve(' expander' , functi on(){
return {
rest ri ct : ' EA' ,
repl ace: true,
t ranscl ude: true,
scope: { t i t l e: ' =expanderTi tle' },
t empl at e: ' <di v>' +
' <di v cl ass="t i t l e" ng-cl i ck="t oggl e()">{{t i t l e}}</ di v>' +
' <di v cl ass="body" ng-show="showMe" ng-t ranscl ude></ di v>' +
' </ di v>' ,
l i nk: functi on(scope, el ement , at t rs) {
scope. showMe = fal se;
scope. t oggl e = functi on t oggl e() {
scope. showMe = ! scope. showMe;
}
}
}
});
这里的 scope: { t i t l e: ' =expanderTi tle' } 是否可以写成 scope: {title:'@'},因为父scope中有title。如果是按书中的写法,是找到父scope的expanderTitle属性,再取它的值title,再对应$scope.title? =。=
从pdf复制过来,有点难看。
<div ng-cont rol l er=' SomeCont rol l er' >
<expander cl ass=' expander' expander-t i t l e=' t i t l e' >
{{t ext }}
</ expander>
</ di v>
angular. modul e(' expanderModul e' , [ ] )
. di rect i ve(' expander' , functi on(){
return {
rest ri ct : ' EA' ,
repl ace: true,
t ranscl ude: true,
scope: { t i t l e: ' =expanderTi tle' },
t empl at e: ' <di v>' +
' <di v cl ass="t i t l e" ng-cl i ck="t oggl e()">{{t i t l e}}</ di v>' +
' <di v cl ass="body" ng-show="showMe" ng-t ranscl ude></ di v>' +
' </ di v>' ,
l i nk: functi on(scope, el ement , at t rs) {
scope. showMe = fal se;
scope. t oggl e = functi on t oggl e() {
scope. showMe = ! scope. showMe;
}
}
}
});
这里的 scope: { t i t l e: ' =expanderTi tle' } 是否可以写成 scope: {title:'@'},因为父scope中有title。如果是按书中的写法,是找到父scope的expanderTitle属性,再取它的值title,再对应$scope.title? =。=
从pdf复制过来,有点难看。