在AngularJS的ng-repeat循环中显示特定元素的div

时间:2014-04-21 21:10:52

标签: html css angularjs

我有以下HTML代码,其中包含一个包含AngularJS&ns-ng-repeat的div。 我想要做的是显示说“你已经投票赞成这个评论”的div"仅适用于单击div [id =" arrow_up"]的特定元素。此代码显示div"您有......"一旦点击,循环的所有元素。 另外要求的是这个div应该在5秒间隔后消失。

    <div  class="col-xs-4"  ng-repeat="review in date_reviews track by $index">
         <div id="arrow_up" class="arrow-up" ng-mouseover="message_up = true" ng-mouseleave="message_up= false" ng-click="saveVote(review[0].review_id,1,$index);" ng-class="{vote_capture_top:voted_up && $index == selectedIndex}"></div>
         <div ng-show = "voted_msg_up" ng-class="{message:$index == selectedIndex}"> You have already voted for this review</div>
         <div class="message" ng-show="message_up">This review is helpful.</div>
    </div>

以下是控制器的saveVote函数。

$scope.saveVote = function(review_id,type,index){
            console.log(review_id)
            email = $cookies.email;
            console.log(type)
            console.log(index)
            $http({
                method: 'POST',
                url: '/saveVote',
                data : {
                        "review_id" : review_id,
                        "vote_type" : type,
                        "emailId" : $cookies.email,
                },
                headers: {
                    'Content-Type': 'application/x-www-form-urlencoded'
                }
                // set the headers so angular passing info as form data (not request payload)
                }).success(function(data, status, headers, config) {
                   $scope.selectedIndex = index;    
                   if(data == "already_voted"){
                    $scope.voted_up = false;
                    $scope.voted_down = false;
                    $scope.isDisabled = true;
                    if(type == 1) {

                        $scope.voted_msg_up = true;
                        $scope.voted_msg_down = false;
                         console.log($scope.voted_msg_up)
                    console.log($scope.voted_msg_down)
                    }else {
                        $scope.voted_msg_up = false;
                        $scope.voted_msg_down = true;
                    }

                   } else if(data == "success") {

                    if(type == 1) {
                        $scope.voted_up= true    
                    }else {
                        $scope.voted_down = true    
                    }
                   }
                }).error(function(data, status, headers, config) {
                    $scope.status = status;
                    $window.alert("error")
                }); 
        }

提前致谢。

1 个答案:

答案 0 :(得分:0)

将div标签更改为以下内容,并为该特定元素显示div。

 <div ng-show = "voted_msg_up && $index == selectedIndex"> You have already voted for this  review</div>

但是如何在5秒后删除div仍然是未知的。