如何在Angularjs中显示基于值的Glyphicon眼睛?

问题描述

对于表单中的所有字段，我都有glyphicon-eye.如果用户单击glyphicon-eye-open，它将变为glyphicon-eye-close，我将该特定字段名称推入数组.

I have glyphicon-eye for all fields in the form. If user click on glyphicon-eye-open then it will change to glyphicon-eye-close and I push that specific field name into an array.

在JSON响应中，我得到了隐藏字段的值，但是如何使用该值并调用精确的glyphicon-eye.

In my JSON response I am getting the hidden field values but how can I use that value and call exact glyphicon-eye.

JSON响应:

{
  "response": {
    "status": {
      "code": "0",
      "message": "Success"
    },
    "service": {
      "servicetype": "4",
      "functiontype": "1005"
    },
    "data": {
      "session_id": "372",
      "roles": [
        {
        "hiddenfields": [
          {
            "fname": "firstname",
            "fblink": "fblink",
            "country": "country",
            "martialStatus": "martialStatus"
          }
        ]
        }
      ]
    }
  }
}

控制器:

 $scope.user = {
            fname: "firstname",  
            lname: "lastname",
            dob: "dob",
            gender: "gender",
            country: "country",
            state: "state",
            city: "city",
            pincode: "pincode",
            martialStatus: "martialStatus",
            emailId: "emailId",
            mobile: "mobile",
            qualification: "qualification",
            fblink: "fblink"

        };

        $scope.allow = {};

        $scope.users = [];

        $scope.push = function(){
            $scope.users = [];
            var user = {}, 
                allow = $scope.allow;
            console.log(allow);
          Object.keys(allow).forEach(function(key){
            allow[key] ? user[key] = $scope.user[key] : null;
          });
          $scope.users.push(user);
        } 

HTML:

<a class="menu-toggle" class="btn btn-default" ng-model="allow.fname"><i class="glyphicon" ng-class="{'glyphicon-eye-open':allow.fname, 'glyphicon-eye-close':!allow.fname}" ng-click="push(allow.fname = allow.fname?false:true)"></i></a>

如果字段值在数组中，那么我需要显示glyphicon-eye-close.

If field value is in array then I need to show glyphicon-eye-close.

推荐答案

有时！在ng-clss内部不起作用.您可以将其替换为

Some times the ! doesnot works inside ng-clss. You please replace that by

<a class="menu-toggle" class="btn btn-default" ng-model="allow.fname">
    <i class="glyphicon" 
     ng-class="{'glyphicon-eye-open':allow.fname.length > 0, 'glyphicon-eye-close':allow.fname.length == 0}" 
     ng-click="push(allow.fname = allow.fname?false:true)">
    </i>
</a>

这篇关于如何在Angularjs中显示基于值的Glyphicon眼睛?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！