angular directive scope

angular directive scope

1.當directive 中不指定scope屬性，則該directive 直接使用 app 的scope；

2.當directive 中指定scope屬性時，scope做用域有3種方式：

　　2.1 .   = : 表明數據雙向綁定，只要該屬性發生改變 ，app（即父做用域） 中scope對應的值和 directive中對應的值將同時發生改變 ； 

　　2.2 .   @ : 表明數據單向綁定，該值的改變只會影響directive ，不會影響app（即父做用域） 其餘值， 也就是孤立做用域 ；

　　2.3 .   & ：表明繼承或者使用父做用域中scope綁定的方法。

 

下面用一個demo 來講明：

example:

directive html:

<gmb-per say="myalert()" abc="gmbPerNotification_d">gmb-per</gmb-per>

coffee directive code :

# module

angular.module('demo',[])
　　.controller 'myCtrl',($scope)->

　　　　$scope.gmbPerNotification_d = [1,2,3]
　　　　$scope.myalert = ->
　　　　　　alert(11)

#directive

pushNotificationApp.directive 'gmbPer',($timeout,$compile) ->
    restrict: 'AE'
    #terminal : true
    transclude : true
    #replace : true
    template:'<div class="col-lg-4 chartWrap" ng-click="say()" ng-repeat="perN in abc">121212</div>'
    #replace : true
    scope:
        abc : '='
        gmbPerNotification_d : '='
        say : '&'
    controller : ($scope) ->

        #$scope.mytest = [1,2]

    link : (scope, element, attrs) ->

        console.log