ui-bootstrap rating title title - как его показать?

Question

uib-rating имеет атрибут titles, где строки определены для значков рейтинга. Есть ли способ, которым эти заголовки можно использовать в качестве подписей? Я не нашел никакой документации по этому поводу.

Answer 1

Если вы определяете titles в сфере, как это:

$scope.titles = ['a','b','c','d','e','f','g','h','i','j']; 

, а затем ссылаться на это в HTML:

<uib-rating ... titles="titles"></uib-rating> 

Вы можете получить доступ к заголовку выбранных в данный момент рейтинг с помощью:

$scope.titles[Number(currentRating) - 1]; 

Я должен был $watchrate переменная для изменений, так что я могу обновить заголовок соответственно:

$scope.$watch('rate', function(value) { 
    $scope.caption = $scope.titles[Number(value) - 1]; 
}); 

Я создал Plunker, где при выборе нового рейтинга, текст ниже будет отображаться соответствующий заголовок.

Edit: Как показать надпись на парении:

Вы можете добавить строку для доступа к подписи функции парения:

$scope.hoveringOver = function(value) { 
    $scope.overStar = value; 
    $scope.percent = 100 * (value/$scope.max); 
    $scope.caption = $scope.titles[Number(value) - 1]; 
}; 

и определить on-leave функцию, которая сбрасывает заголовок:

$scope.hoveringOut = function() {  
    $scope.overStar = null; 
    $scope.caption = null; 
} 

<uib-rating ... on-leave="hoveringOut()"></uib-rating> 

Для демонстрации см. here.