ionic 写一个五星评价（非指令）

Controller里的代码：

 1 .controller('evaluateCtrl', function($scope, $state, $stateParams, $ionicPopup,$ionicHistory,Popup) {
 2 
 3     //定义一个数组 映射五颗星星的位置和图片
 4     $scope.starArray = [
 5       {"id" : 1,
 6         "src":"img/icons/starBack.png"
 7       },
 8       {"id" : 2,
 9         "src":"img/icons/starBack.png"},
10       { "id" : 3,
11         "src":"img/icons/starBack.png"},
12       { "id" : 4,
13         "src":"img/icons/starBack.png"},
14       { "id" : 5,
15         "src":"img/icons/starBack.png"
16       }
17     ];
18      //初始化评价星级为0
19     $scope.currentStar = 0;
20      //改变星星的背景图  点击的当前星星和做左边的星星换成亮图，右边的星星变成灰图
21     function changeStars(){
22       for(var i = 0;i < $scope.starArray.length; i++){
23         if($scope.currentStar >= $scope.starArray[i].id){
24           $scope.starArray[i].src = "img/icons/star.png";
25         }else{
26           $scope.starArray[i].src = "img/icons/starBack.png";
27         }
28       }
29     }
30 
31     //点击星星的操作
32     $scope.clickStar = function(item){
33       $scope.currentStar = item.id;
34       changeStars();
35     };
36     //点击评价按钮 判断用户是否已经点击星星 给与评价
37     $scope.clickPublish = function() {
38       if($scope.currentStar == 0){
39         //若没点击，弹出提示
40         Popup.loadMsg('请点击对应的星星给协作人评价！', 1500);
41       }else{
42         //TODO
43       }
44     };
45 
46   })

html 里的代码

1 <div class="center_div" style="height:60px;padding-left: 20px;padding-top: 10px;padding-right: 20px;">
2         <div style="float:left;white-space:nowrap" ng-repeat="item in starArray">
3           <img ng-click="clickStar(item)" src="{{item.src}}"/>
4         </div>
5       </div>