angularjs - Angular directive being called before AJAX call populates data -

i have issue @ moment directive whereas scope values set in parent controller not set when directive tried access them. because directive called before ajax call has returned data. there make directive wait data set before continuing?

here directive:

return {                 restrict: 'e',                 //scope: {},                 templateurl: window.baseurl + '/template-common/directives/blurgallery',                 // -------------------------------------------------------------                 link: function(scope, element, attrs) {                      var $gallery = $('body').find('.the-gallery'),                         $item = $gallery.find('.preview-content');                      console.log($scope.tasks);                      scope.gallery = { 

the view (jade) code:

blur-gallery(gallery-items) 

and controller code:

//get task details                 pptaskservice.loadtaskdetails($scope.thetaskid)                     .then(function(response) {                         $scope.task = new taskwrapper(response);                          $scope.isdataloaded = true;                     }); 

as can see, controller asks service retrieve data , set $scope.task variable directive trying access before has returned (as can see console.log).

thanks

in directive, use scope.$watch() on either scope.task or scope.isdataloaded notified when data available. there, continue perform directive logic.

for example:

scope.$watch('isdataloaded', function(newvalue, oldvalue) {     if (newvalue === true)     {         /* stuff data */     } });