Загрузить директиву после вызова AJAX

Question

Я создал директиву для разбивки на страницы, которая принимает два аргумента; текущую страницу и общее количество страниц.

<pagination page="page" number-of-pages="numberOfPages"></pagination>

Вопрос заключается в том, что я буду знать только значение NUMBEROFPAGES после вызова AJAX (через нг-ресурса). Но моя директива уже была сделана до того, как будет выполнен вызов AJAX.

app.controller('MyController', function ($scope, $routeParams) { 
    $scope.page = +$routeParams.page || 1, 
    $scope.numberOfPages = 23; // This will work just fine 

    MyResource.query({ 
     "page": $scope.page, 
     "per_page": 100 
    }, function (response) { 
     //This won't work since the directive is already rendered 
     $scope.numberOfPages = response.meta.number_of_pages; 
    }); 
}); 

Я предпочитаю ждать с рендерингом моего шаблона контроллеров до тех пор, пока вызов AJAX не будет закончен.

План B заключается в том, чтобы добавить шаблон с шаблоном директив при выполнении вызова AJAX.

Я застрял в разработке обоих сценариев.

Answer 1

Вы должны ждать, пока значение с $watch функционировать как:

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

Директива

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 
      } 
     }); 
     } 
    }; 
    } 
]); 

Тон задает: Ваша директива может использовать изолированный объем, но и так же принцип стоит.

Answer 2

Если вы используете resolve от ui-router, вы можете иметь meta или meta.number_of_pages впрыскивается в контроллере, прежде чем это вид визуализируется.

//routes.js 
angular.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.js 
app.controller('MyController', function ($scope, $routeParams, meta) { 
    $scope.page = +$routeParams.page || 1, 
    $scope.numberOfPages = meta.number_of_pages; 
}); 

Answer 3

Но это не возможно, чтобы просто предотвратить рендеринг, пока все не будет сделано

• Я думаю, нг-если бы сделать это, в отличие от нг-шоу/нг скрытие который только изменить фактический дисплей