Directive In ionicModal complies first, before even controller loaded

I have a $ionicModal and inside that I have a directive, lets call it <scrap-link-cards> , this takes in the a two way data bind value of a scope object. This is inside a $ionicModal template:-->

<scrap-link-cards datasource=(updates.update_links)> </scrap-link-cards> 

This is my full directive:

.directive('scrapLinkCards', function ($log) {
        var controller = function ($scope) {
            $scope.links = angular.copy($scope.datasource); //undefined
            $scope.LastIndex = $scope.links.length - 1;
        };
       var templateUrl ='/path/to/template' ;

        return{
            restrict :'E',
            controller: controller,
            scope: {
              datasource :'='
            },
            templateUrl : templateUrl
        }
    })

This is my templateUrl's Template:

<div class="scrapLinks">
    <h3>{{links[LastIndex].title}}</h3>
    <p>{{links[LastIndex].description}}</p>
</div>

Please NOTE that, this is inside a $ionicModal:

$ionicModal.fromTemplateUrl('path/to/template/html', {
        scope: $scope,
        animation: 'slide-in-up'
    }).then(function ($ionicModal) {
        $scope.ReadMore = $ionicModal;
});

Now here is my problem, since its inside a $ionicModal, the HTML gets complied, before angular can have access to (updates.updates_links). I get a undefined object at $scope.links. How can I workaround this? I have tried using link function of directive, (moved all the logic in link) still.. I think $ionicModal templates are compiled before controller loaded ? Is it?