IONIC：喜欢不喜欢`ng-repeat`内的功能

Question

我是新的离子框架。目前我正在研究离子iOS应用程序。我需要做一些不喜欢的功能。由于我有多个记录来自网络服务，对于每条记录，我必须将类似，不喜欢和评论总数的功能并将这些信息保存到database。

还改变CSS的喜欢和不喜欢的按钮。

我不明白如何建立这个功能到我的app.Please帮我做到这一点。

Answer 1

试试这个方法：

angular.module('main',[]).controller('mainController', function($scope, $http){ 
 

 
    $scope.items = [ 
 
    {"id":1,"title": "item1", "like": false}, 
 
    {"id":2,"title": "item2", "like": true}, 
 
    {"id":3,"title": "item3", "like": false}, 
 
    {"id":4,"title": "item4", "like": true}, 
 
    {"id":5,"title": "item5", "like": false}, 
 
    {"id":6,"title": "item6", "like": true}, 
 
    {"id":7,"title": "item7", "like": false}, 
 
    {"id":8,"title": "item8", "like": false}, 
 
    {"id":9,"title": "item9", "like": true}, 
 
    {"id":10,"title": "item10", "like": false}, 
 
    
 
    
 
    ]; 
 
    
 
    $scope.toggle_like = function(item){ 
 
     
 
     //send item.id to HTTP Call to change id in DB and execute following statement in success callback 
 
     item.like = !item.like; 
 
    
 
    } 
 

 
})

.fake_link:hover{ 
 
cursor:pointer; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.0/angular.min.js"></script> 
 
<div ng-app="main" ng-controller="mainController"> 
 
<table> 
 
<thead> 
 
    <tr> 
 
    <th> Title </th> 
 
    <th> Like </th> 
 
    
 
    </tr> 
 

 
</thead> 
 
<tbody> 
 
    <tr ng-repeat="item in items"> 
 
    <td> {{item.title}} </td> 
 
    <td ng-click="toggle_like(item)" class="fake_link"> <span ng-if="item.like"> Unlike </span> <span ng-if="!item.like"> Like </span> </td> 
 
    </tr> 
 

 
</tbody> 
 
</table> 
 
</div>

这里是工作提琴，以及： https://jsfiddle.net/Lxwbeeat/