title: Angular call directive function from template
body: <p>I'm new to angular and can't figure out how to call a directive function from the template. I have some fuctionality that will be reused throught the app and figured I would just make a directive with all the functionlity needed, that can easily be shared accross different modules. While searching for answers I came across this post: <a href="https://stackoverflow.com/questions/16881478/how-to-call-a-method-defined-in-an-angularjs-directive">how-to-call-a-method-defined-in-an-angularjs-directive</a>
  which seems like a good solution. However, I can't seem to figure out why my directive method showPolicy() is not being called.</p>
  
  <p>// controller:</p>
  
  <pre><code>(function(){
  'use strict';
  
  angular.module('releaseAppsModule')
  .controller('releaseAppsController', releaseAppsController);
  
  releaseAppsController.$inject = ['$rootScope', 
  'storageFactory', 
  'releaseAppsFactory',
  '$modal',
  '$translate',
  'getIconFactory',
  '$scope',
  '$filter'];
  
  function releaseAppsController($rootScope, storageFactory, releaseAppsFactory, $modal, $translate, getIconFactory, $scope, $filter) {
  
    var vm = this;
    vm.policyControl = {};
    ...
  </code></pre>
  
  <p>// controller template:</p>
  
  <pre><code>&lt;tr ng-repeat="policyRelease in regionRelease.policyReleases | orderBy:vm.orderByField:vm.reverseSort" ng-if="policyRelease.status == 'NEW' || policyRelease.status == 'SCHEDULED'"&gt;
  &lt;td&gt;
  &lt;policy control="vm.policyControl" release-item="policyRelease" class="release-apps-app-btn app-release-data"&gt;&lt;/policy&gt;
  &lt;/td&gt;
  </code></pre>
  
  <p>// directive:</p>
  
  <pre><code>(function(){
  'use strict';
  
  angular.module('myApp')
  
  .directive('policy', policy)
  
      function policy() {
  
          var directive = {
              restrict: 'E',
              link: link,
              replace: true,
              scope: {
                  releaseItem: '=',
                  control: '='
              },
              template: '&lt;a ng-click="vm.policyControl.showPolicy({releaseItem: releaseItem});"&gt;{{ releaseItem.policy.name }}&lt;/a&gt;'
          };
  
          return directive;
  
          function link(scope, el, attr) {
              scope.internalControl = scope.control || {};
              scope.internalControl.showPolicy = function (releaseData) {
                  ...
              } // showPolicy
  
              scope.internalControl.showPolicyModal = function(response, releaseData) {
                  ...
              } // showPolicyModal
  
          } // link
  
      } // policy
  
  })();
  </code></pre>