如何在 ng-repeat 中为特定索引处理 ng-show

Question

HTML：

        <div class="displayImgData col-sm-3" ng-repeat="item in profileData" >

          <a ng-show="onLoadFav" title="Make as Favourite"> 
             <img class="styleright" src="assets/images/unfavourite.png" ng-if="(item.favourite ==0)" ng-click="favouriteUser(item.userid);">
     </a>  

        <a ng-show="onLoadUnFav" title="Favourite"> 
    <img class="styleright" src="assets/images/favourite.png"  ng-if="(item.favourite ==1)" ng-click="unfavouriteUser(item.userid);" >`
     </a>`

        <a ng-show="newFav" title="Make as Favourite">  
    <img class="styleright" src="assets/images/unfavourite.png" ng-click="favouriteUser(item.userid);">
     </a> 

        <a ng-show="newUnFav" title="Favourite">
     <img class="styleright" src="assets/images/favourite.png"  ng-click="unfavouriteUser(item.userid);" > 
    </a>
</div>

JS：

$scope.onLoad = function(){
   $scope.profileData = [{'favourite':0,'userid':1},{'favourite':0,'userid':2},{'favourite':1,'userid':3}]
};
 $scope.onLoadFav = false;
$scope.onLoadUnFav = false;
$scope.newFav = false;
$scope.newUnFav = true; 
 $scope.unfavouriteUser= function(){
UserService.getSocialMedia(json).then(function (res) {   
   if(res.statuscode == 0){
    $scope.onLoadFav = false;
    $scope.onLoadUnFav = false;
    $scope.newFav = false;
    $scope.newUnFav = true;   
     } 
         });
  };

我有onload()，我在加载页面时调用它，如果item.favourite == 1在我的$scope.profileData 中，我将启用我的favourite.png，如果item.favourite == 0 启用unfavourite.png。如果我想单独制作一个特定的记录不受欢迎。我正在使用 unfavourite() 并且我从后端得到响应为 success 。如果我再次调用onload()，就像再次重新加载整个页面一样。所以我分别在html中给出ng-show = onLoadFav ,onLoadUnFav, newFav, newUnFav以使其相应地启用图标。但问题是，因为它在ng-repeat中所有图标都已启用或 disabled ，而不是特定的。如何在 ng-repeat 中为特定索引处理 ng-show

Answer 1

我没有测试代码，很快就会做。但您可以使用由 userid 寻址的数组

<div class="container" ng-app="confusionApp">
  <div class="displayImgData col-sm-3" ng-controller="testCtrl" ng-repeat="item in profileData" >

    <a ng-show="loadData[item.userid].onLoadFav" title="Make as Favourite">
      <img class="styleright" src="assets/images/unfavourite.png" ng-if="(item.favourite ==0)" ng-click="favouriteUser(item.userid);">
    </a>

    <a ng-show="loadData[item.userid].onLoadUnFav" title="Favourite">
      <img class="styleright" src="assets/images/favourite.png"  ng-if="(item.favourite ==1)" ng-click="unfavouriteUser(item.userid);" >`
    </a>`

    <a ng-show="loadData[item.userid].newFav" title="Make as Favourite">
      <img class="styleright" src="assets/images/unfavourite.png" ng-click="favouriteUser(item.userid);">
    </a>

    <a ng-show="loadData[item.userid].newUnFav" title="Favourite">
      <img class="styleright" src="assets/images/favourite.png"  ng-click="unfavouriteUser(item.userid);" >
    </a>
  </div>
</div>

那就是控制器

angular.module('testApp',[])

    .controller('testCtrl',['$scope', function($scope) {

      $scope.loadData = [];

      $scope.onLoad = function(){
        $scope.profileData = [{'favourite':0,'userid':1},{'favourite':0,'userid':2},{'favourite':1,'userid':3}];

        for (var i=0; i < $scope.profileData.length; i ++ ) {
          $scope.loadData[$scope.profileData[i].userid] = {onLoadFav : false, onLoadUnFav : false, newFav: false, newUnFav : true};
        }

      };




      $scope.unfavouriteUser= function(pUserID){



        UserService.getSocialMedia(json).then(function (res) {
          if(res.statuscode == 0){
            $scope.loadData[pUserID].onLoadFav = false;
            $scope.loadData[pUserID].onLoadUnFav = false;
            $scope.loadData[pUserID].newFav = false;
            $scope.loadData[pUserID].newUnFav = true;
          }
        });
      };

      $scope.onLoad();

    }]);