Load directive after AJAX call

But isn't it possible to just prevent the rendering until all is done

• I think ng-if would do that, contrary to ng-show/ng-hide which just alter the actual display

You have to wait for the value using a $watch function like:

<div before-today="old" watch-me="numberOfPages" >{{exampleDate}}</div>

Directive

angular.module('myApp').directive('myPagingDirective', [  function () {    return {        restrict: 'A',         link: function (scope, element, attr) {        scope.$watch(attr.watchMe,function(newValue,oldValue){                //check new value to be what you expect.             if (newValue){                             // your code goes here             }        });      }     };  }]);

Imporant: Your directive may use an isolated scope but even so the same principle stands.

If you use resolve from ui-router, you can have meta or meta.number_of_pages injected in your controller BEFORE it's view gets rendered.

//routes.jsangular.module('app')  .state('some_route', {    url: '/some_route',    controller: 'MyController',    resolve: {      meta: ['MyResource', function (MyResource) {        return MyResource.query({          "page": $scope.page,          "per_page": 100        }, function (response) {          return response.meta;        });      }]    }  });//controllers.jsapp.controller('MyController', function ($scope, $routeParams, meta) {  $scope.page = +$routeParams.page || 1,    $scope.numberOfPages = meta.number_of_pages;});