попутных функции и сфера вары директивы в объекте

Question

я написал директиву, которая выглядит следующим образом:

на родительском HTML:

 <cl-sort-n-reverse flip-reverse="flipReverse()" set-key="setKey(key)" sort-key="sortKey"   rev="reverse" key="body" title="Content"></cl-sort-n-reverse> 

в директиве ЯШ:

.directive('clSortNReverse', function() { 
    return { 
     restrict: 'E', 
     scope:{ 
      innerKey : '@key', 
      title : '@title', 
      inReverse: '=rev', 
      sortKey:'=', 
      flipReverse:'&', 
      setKey:'&' 

     }, 
     transclude :true, 
     templateUrl:'../devhtml/common/sortNReverse.html', 
     link: function (scope, element, attrs) { 

     } 
    }; 
}); 

в шаблоне :

<span> 
     <div class="btn" ng-if="sortKey!=innerKey" data-ng-click="setKey({key:innerKey});"> 
     {{title}} 
    </div> 
    <div class="btn" ng-if="sortKey==innerKey" data-ng-click="flipReverse();"> 
     <b>{{title}}</b> 
     <i ng-if="inReverse===true" class="fa fa-caret-up"></i> 
     <i ng-show="inReverse===false" class="fa fa-caret-down"></i> 
    </div> 
</span> 

Я бы r одинаково нравится уметь вставлять обе функции и классы уровня видимости, такие как sortKey, и обратное к атрибуту внутри одного объекта, который я могу объявить в своем контроллере. ответы, которые я нашел здесь относительно добавления объектов к директивным атрибутам, касались более простого случая, когда объекты инкапсулируют только простую строку или числа. Я смущен тем, как определить, что объекты опций включают в себя $ scope level stuff

Answer 1

Это вы имели в виду?

В контроллере:

$scope.sortReverseConfig = { 
    flipReverse: function() {...}, 
    setKey: function(key) {...}, 
    sortKey: '', 
    innerKey: $scope.body, 
    inReverse: $scope.reverse, 
    title: $scope.content 
} 

В вашем HTML:

<cl-sort-n-reverse config="sortReverseConfig"></cl-sort-n-reverse> 

Директива:

.directive('clSortNReverse', function() { 
    return { 
     restrict: 'E', 
     scope:{ 
      config: '=' 
     }, 
     transclude :true, 
     templateUrl:'../devhtml/common/sortNReverse.html', 
     link: function (scope, element, attrs) { 

     } 
    }; 
}); 

шаблона Директива:

<span> 
    <div class="btn" ng-if="config.sortKey != config.innerKey" data-ng-click="config.setKey({key:config.innerKey});"> 
    {{config.title}} 
    </div> 
    <div class="btn" ng-if="config.sortKey == config.innerKey" data-ng-click="config.flipReverse();"> 
    <b>{{config.title}}</b> 
    <i ng-if="config.inReverse === true" class="fa fa-caret-up"></i> 
    <i ng-show="config.inReverse === false" class="fa fa-caret-down"></i> 
    </div> 
</span>