Директива AngularJS с асинхронными параметрами в области

Question

Я пытаюсь сделать директиву для более легкого доступа к статическим датам в моем приложении. В моем $ rootScope у меня есть объект params, который содержит статические данные, поступающие с сервера backend. Цель этой директивы - легко получить доступ к объекту params в html-коде. Есть 2 параметра:

• пары-имя, которое содержит имя запрашиваемого объекта
• пары-идентификатор, который содержит ключ объекта для доступа

В результате названия атрибут объект запроса.

В моем HTML коде, у меня есть

<ng-params param-name="ContactOrigins" param-id="contact.origin_id"></ng-params> 

В моем JS коде, у меня есть:

myApp.directive('ngParams', 
    function($rootScope){ 
     return{ 
      restrict: 'E', 
      template : '<span>{{value}}</span>', 
      scope: { 
       paramName: '@', 
       paramId: '=' 
      }, 
      link: function(scope,element,attrs){ 
       var tab = $rootScope.params[scope.paramName]; 
       console.log(scope.paramId); 
       scope.value = ''; 
       for(var i = 0; i < tab.length; i++) { 
        if(tab[i]['id'] == scope.paramId) { 
         scope.value = tab[i]['title']; 
        } 
       }; 
       if(scope.value == '') 
        scope.value = '<em>Not specified</em>' 
      } 
     } 
    } 
); 

Когда страница загружена, console.log(scope.paramId) дать мне "неопределенный" результат. Так что это не работает должным образом. Дело в том, что объект contact загружается асинхронно через запрос $ http на серверный сервер. И моя идея состоит в том, что запрос $ http еще не разрешен, и директива пытается работать с пустым объектом. Последняя дополнительная точка: директива отлично работает, когда я помещаю жестко закодированное значение в атрибут param-id (например, param-id="3").

Мой первый вопрос: я прав с моей идеей? Мой второй вопрос: есть ли способ обхода этой проблемы? Можно ли отложить компиляцию директивы до тех пор, пока не будет решена $ http?

Answer 1

Как @migg сказал мне, решение использовать $ часы ...

timmApp.directive('ngParams', 
    function($rootScope){ 
     return{ 
      restrict: 'E', 
      templateUrl : 'js/directives/_params.html', 
      scope: { 
       paramName: '@', 
       paramId: '=' 
      }, 
      link: function(scope,element,attrs){ 
       scope.value = ''; 
       scope.$watch('paramId', function(){ 
        if(typeof scope.paramId != 'undefined'){ 
         var tab = $rootScope.params[scope.paramName]; 
         for(var i = 0; i < tab.length; i++) { 
          if(tab[i]['id'] == scope.paramId) { 
           scope.value = tab[i]['title']; 
          } 
         }; 
        } 
       }); 
      } 
     } 
    } 
); 

Спасибо @migg !!!