在angularjs中实现评级

我正在尝试用AngularJS实现评级。我有一个星，点击星，我应该在一个圆形的水平条内显示数字（1，2，3）。现在，假设我从这个条中单击2，那么应该通过隐藏水平条返回数字2。请帮我做这件事。我试着把星星显示如下。但不确定如何在点击这颗星后实现条内的数字。 我能够找到与星级有关的查询，但对这个特定场景一无所知

下面的代码显示星形图标。我所需要做的就是点击这个星形图标，将一个水平条与数字关联起来。如果你能为我提供一些如何做的指导，那就太好了

<div style="float:left;clear:both;padding-top:2px">
    <b style="font-weight:400">
        <i class="icon ion-ios-star-outline tabfont" style="font-size:25px;color:#443D6F"></i>
        <div class="wrapper"></div>
    </b>
</div>

---

您是否尝试编写javascript？是的，我编写了控制器代码，其中包含所选评级的信息。同时共享控制器添加了控制器代码可能是一个带有数字的div，单击星号即可显示

.controller('QuestionaireCtrl', function($scope) {
  $scope.heading = "Questionaire";
  // $scope.rating = true;
  // $scope.responses = {    
  //   "q1":"",
  //   "rating":0
  // };
  $scope.ratingData = {
   "CISCO":{
      "headcount":"30",
      "questions":{
         "Contractual/Commercial Aspects":[
            {
               "question":"SLA/SLO is reported on time, everytime?",
               "rating":"1"
            },
            {
               "question":"Test outcomes are aligned with Contractual commitments?",
               "rating":"2"
            },
            {
               "question":"Test scope is clear and baselined?",
               "rating":"2"
            },
            {
               "question":"Contractual Dependencies with respect to  resource, infrastructure, Schedule and costs are defined and managed?",
               "rating":"3"
            },
            {
               "question":"Contractual commitments and base solution are understood by the Delivery team?",
               "rating":"2"
            },
            {
               "question":"Productivity commitments are delivered to the client?",
               "rating":"2"
            },
            {
               "question":"Profitability and revenue improvement opportunities are continuously identified?",
               "rating":"2"
            }
         ],