данные Angularjs Каталог выполненный перед тем службы вызываются из контроллера

Question

Привета Я работал с угловой директивой и я создал один ...

app.directive('customtable', function() { 
    return { 
     restrict: 'A', 
     require: 'ngModel', 
     link: function (scope, element, attrs) { 
      var html = '<table>'; 
      angular.forEach(scope[attrs.rows], function (row, index) { 
       //html += '<tr><td>' + row.A+ '</td></tr>'; 
       html += '<tr><td>' + row.B+ '</td>' + 
       '<td>' + row.C+ '</td>' + 
       '<td>' + row.D+ '</td>' + 
       '<td>' + row.E+ '</td>' + 
       '<td>' + row.F+ '</td>' + 
       '<td>' + row.G+ '</td>' + 
       '<td>' + row.H+ '</td></tr>'; 
       if (index == 4) { 
        html += '<tr><td>' + 'Click Here to See All' + '</td></tr>'; 
       } 
      }) 
      html += '</table>'; 
      element.replaceWith(html) 
     } 
    } 
}); 

Я зову эту директиву от:

<table> 
<tr customtable ng-model="data" rows="data" ng-hide="hideRows && $index > 4 && $index < (myArray.length - 5)"> 

</tr> 
</table> 

завода метода :

dataFactory.getdate().success($scope.handleSuccess).then(function (result) { 
    $scope.data= result.data; 
}); 

Здесь проблема заключается в том, что моя переменная scope $ scope.data устанавливается с заводского мето д. сначала мой код директивы запускается, а затем вызывается фабричный сервис. поэтому я получаю переменную данных undefined в директивном коде. любая помощь и предложения приветствуются. Я как бы застрял.

Answer 1

Создайте изолированную область в данных ваших директивных вызовов и поставьте часы на эту переменную области видимости.

Пример: Plunker Передайте любую дополнительную информацию, необходимую в вашей директиве, таким же образом.

.directive('customtable', function() { 
    return { 
     restrict: 'A', 
     scope: { 
      data: '=' 
     }, 
     link: function (scope, element, attrs) { 
      var html = '<table>'; 
      scope.$watch('data', function(newValue, oldValue) { 
       if (newValue === oldValue) return; 
       angular.forEach(newValue, function (row, index) { 
        //html += '<tr><td>' + row.A+ '</td></tr>'; 
        html += '<tr><td>' + row.B+ '</td>' + 
        '<td>' + row.C+ '</td>' + 
        '<td>' + row.D+ '</td>' + 
        '<td>' + row.E+ '</td>' + 
        '<td>' + row.F+ '</td>' + 
        '<td>' + row.G+ '</td>' + 
        '<td>' + row.H+ '</td></tr>'; 
        if (index == 4) { 
         html += '<tr><td>' + 'Click Here to See All' + '</td></tr>'; 
        } 
       }) 

       html += '</table>'; 
       element.replaceWith(html) 
      }); 


     } 
    } 
});