2014-02-15 7 views
0

Если существует определенная директива, может ли область, переданная ей через атрибуты, определенные на ней, использоваться внутри этой директивы для получения необходимых результатов для использования в шаблоне? то есть у меня есть такая директиваМожет ли директива изолированной области использоваться внутри директивы для вычислений

var carAuction = angular.module('carAuction'); 

carAuction 
    .controller('mainCtrl', function($scope) 
    { 
     var car = { 
      comments: [] 
     }; 

     car.comments.push({ 
      comment: 'Ok car', 
      rating: 1 
     }); 

     car.comments.push({ 
      comment: 'Nice car.', 
      rating: 2 
     }); 

     car.comments.push({ 
      comment: 'Awesome car!', 
      rating: 3 
     }); 

     $scope.car = car; 
    }) 
    .directive('carCommentRaiting', function() 
    { 
     return 
     { 
      restrict: 'E', 
      templateUrl: 'path/to/template.html', 
      scope: 
      { 
       value: '=value', 
       maxValue: '=max-value' 
      } 
     }; 
    }) 
    .filter('range', function() 
    { 
     return function(input, total) 
     { 
      total = parseInt(total); 

      for (var i=1; i<=total; i++) 
      { 
       input.push(i); 
      } 

      return input; 
     }; 
    }); 

В HTML части у меня есть

<div> 
    <div ng-repeat="comment in car.comments"> 
     Rating: <car-comment-raiting value="comment.rating" max-value="10"></car-comment-raiting> 
    </div> 
</div> 

template.html

<div> 
    <ul class="list-inline"> 
     <li ng-repeat="n in [] | range:value"><span class="glyphicon glyphicon-star"></span></li> 
    </ul> 
</div> 

И я хочу передать дополнительное значение в шаблон, который должен быть рассчитан как maxValue - value. Не нашел примеров, описывающих это. Мысль об использовании свойства link, но описание говорит, что оно используется для других целей.

UPD: я был в состоянии исправить это с

return { 
    restrict: 'E', 
    templateUrl: 'path/to/template.html', 
    scope: 
    { 
     value: '=', 
     maxValue: '=' 
    }, 
    controller: function($scope) 
    { 
     $scope.calculated = $scope.maxValue - $scope.value; 
    } 
}; 

, но по какой-то причине он не работает все время. Один раз он работает, а в другой раз calculated переменная null.

+0

пожалуйста, напишите 'template.html' или Fiddle –

ответ

2

Все вычисления должны выполняться внутри прямой ссылки или в контроллере. Вот пример директивы:

.directive('carCommentRaiting', function() { 
     return { 
      restrict: 'E', 
      template: 'path/to/template.html', 
      scope: { 
       value: '=value', 
       maxValue: '=max-value' 
      }, 
      link : function(scope, element, attr) { 
       scope.calculated = scope.maxValue - scope.value; 
       /// watch value to update calculated on value update: 
       scope.$watch('value', function(newValue){ 
         scope.calculated = scope.maxValue - newValue; 
       }); 
      } 
     }; 
    }); 
+0

Пробовал в контроллере, но не решает проблему, но ссылка собственность была магия, я искал. Также нет необходимости вычислять внешние '$ watch'. Спасибо. – Eugene

Смежные вопросы