<script> template does not get initialized with ng-init

Question

New to angularjs and templates. I wish to create a tooltip that has two options to download a file(as zip and csv). Cannot get the functionality to work.

Html looks as follows.

<script type="text/ng-template" id="buttonsTemplate.html">
  <div class="ui-grid-cell-custom" ng-if="row.entity.testResult">
    <span class="download glyphicon glyphicon-download-alt" ng-init="initDownload()" ng-click="toggleDownload($event)"/>
  </div>
  <div ng-if="!row.entity.testResult" class="ui-grid-cell-custom">
    <span class="glyphicon glyphicon-time"></span>
  </div>
</script>


<script type="text/ng-template" id="downloadPopover.html">
<div class="row download-tooltip">
  <div class="col-md-6 download-item">
    <a href="test/result?testId={{row.entity.id}}" target="_self">
      <img class="download-icon"
          src="zip_icon.jpeg"
           width="65">
      <span>ZIP</span>
    </a>
  </div>

  <div class="col-md-6 download-item">
    <a href="test/resultCsv?testId={{row.entity.id}}" target="_self">
      <img class="download-icon"
          src="csv_icon.jpeg"
           width="65">
      <span>CSV</span>
    </a>
  </div>
</div>
</script>

The JS code is

$scope.toggleDownload = function (e) {
    e.stopPropagation();
    if (!listenerAdded) {
        $('.modal-content').click(function (e) {
            tooltipObj.tooltip($(e.target).is('.download-item,.download-tooltip,.download-inner') ? '' : 'hide');
            listenerAdded = true;
        });
    }

};

$scope.initDownload = function () {
    tooltipObj = $('.download').tooltip({
        placement: 'bottom',
        trigger: 'click',
        html: true,
        title: $templateCache.get('downloadPopover.html')
    });
}

I have a similar functionality in which the initialization part(ng-init) is not wrapped in <script>. So I am guessing it has something to do with dynamic templates not being compiled? Any suggestions or recommendations would be helpful.