поставить текстовую сторону основного компонента рейтинга

Question

Вот StackBlitz моей проблемы

<h6>
  <p-rating [(ngModel)]="raitng" [cancel]="false" ></p-rating>
<span> (5)</span>
</h6>

Я хочу, чтобы последний <span>5</span> находился только справа или слева от компонента Rating.Как мне это сделать.Пожалуйста, смотрите StakBlitz

Спасибо.

Answer 1

Просто поместите вашу ngModel с интерполяцией строк между тегами span Как:

<h6>
  <p-rating [(ngModel)]="raitng" [cancel]="false" ></p-rating>
<span> {{raitng}}</span>
</h6>

Обновлено В правой части просто добавьте style = "display: inline-block;"для элемента p-рейтинга, например:

<h6>
  <p-rating [(ngModel)]="raitng" style="display: inline-block;" [cancel]="false" ></p-rating>
<span> {{raitng}}</span>
</h6>