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

标签 html css angularjs

我有下面的 HTML 代码和一个 div,它有 AngularJS 的 ng-repeat。 我想要做的是仅针对单击 div[id="arrow_up"] 的特定元素显示显示“您已经投票赞成此评论”的 div。此代码显示 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>

下面是来自 Controller 的 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")
                }); 
        }

提前致谢。

最佳答案

将 div 标签更改为以下内容,它使 div 出现在该特定元素上。

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

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

关于html - 在 AngularJS 的 ng-repeat 循环中显示特定元素的 div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23206104/

相关文章:

javascript - 带负数的文本区域计数器/倒计时和强制执行

html - div 的宽度与屏幕尺寸无关

html - 如何将 div 元素放置在屏幕的右侧

C# - 使用 HTML Agility 提取特定的 div 类文本

html - 图片宽度动态高度叠加

php - 仅当管理员登录并为 php 中的用户禁用时,我如何启用链接

javascript - 如何在 Angular js中显示加载微调器

javascript - 动态 ng 类值

javascript - 如何从 textarea 中获取突出显示的文本位置?

javascript - 使用 TypeScript 和 controllerAs 将方法附加到 Controller