过滤angularjs中每个键的唯一值并进行检查_Angularjs

过滤angularjs中每个键的唯一值并进行检查

angularjs

过滤angularjs中每个键的唯一值并进行检查,angularjs,Angularjs,我有一个有角度的物体，我必须用过滤器和排序来显示它的记录。此外，我还必须使用复选框显示对象中每个键的唯一值记录。我用过滤器和排序显示记录，也用复选框显示每个键的唯一值。现在我必须获得每个键的这些复选框的值下面是我的代码和plunker url。 index.html <body ng-controller="myController"> <label ng-repeat="option in structure.tabs"> <input type=

我有一个有角度的物体，我必须用过滤器和排序来显示它的记录。此外，我还必须使用复选框显示对象中每个键的唯一值记录。
我用过滤器和排序显示记录，也用复选框显示每个键的唯一值。
现在我必须获得每个键的这些复选框的值

下面是我的代码和plunker url。
index.html

<body ng-controller="myController">
<label ng-repeat="option in structure.tabs">
    <input type="checkbox" ng-model="option.selected">{{option.index}}
</label>
<table border="1" width="100%">
    <tr>
        <th ng-repeat="header in structure.tabs" ng-show="header.selected" ng-click="sortData(header.filter)">{{header.index}}</th>
    </tr>
    <tr ng-repeat="data in structure.info | orderBy:sortColumn:reverseSort">
        <td ng-show="structure.tabs[0].selected">{{data.name}}</td>
        <td ng-show="structure.tabs[1].selected">{{data.age}}</td>
        <td ng-show="structure.tabs[2].selected">{{data.city}}</td>
        <td ng-show="structure.tabs[3].selected">{{data.designation}}</td>
    </tr>
</table>
<h1>Unique Values Table (per key)</h1>
<table border="1" width="100%" style="margin-top: 50px;">
    <tr>
        <th ng-repeat="header1 in structure.tabs" ng-show="header1.selected">{{header1.index}}</th>
    </tr>
    <tr>
        <td ng-repeat="(hk, hv) in structure.tabs" ng-show="hv.selected">
            <table border='1'>
                <tr ng-repeat="(dk, dv) in structure.info | unique:hv.filter">
                    <td>
                        <input type="checkbox">{{dv[hv.filter]}}
                    </td>
                </tr>
            </table>
            <br>
            <button ng-click="getChecked(hv.filter)">Get Checked</button>
        </td>
    </tr>
</table>
</body>

<!DOCTYPE html>
<html ng-app="myApp">

 <head>
  <meta charset="utf-8" />
  <title>AngularJS Plunker</title>
  <script>document.write('<base href="' + document.location + '" />'); </script>
  <link rel="stylesheet" href="style.css" />
  <script data-require="angular.js@1.4.x" src="https://code.angularjs.org/1.4.12/angular.js" data-semver="1.4.9"></script>
 <script src="script.js"></script>
</head>

<body ng-controller="myController">
<h1>Filter Table</h1>
<label ng-repeat="option in structure.tabs">
    <input type="checkbox" ng-model="option.selected">{{option.index}}
</label>
<table border="1" width="100%">
    <tr>
        <th ng-repeat="header in structure.tabs" ng-show="header.selected" ng-click="sortData(header.filter)">{{header.index}}</th>
    </tr>
    <tr ng-repeat="data in structure.info | orderBy:sortColumn:reverseSort">
        <td ng-show="structure.tabs[0].selected">{{data.name}}</td>
        <td ng-show="structure.tabs[1].selected">{{data.age}}</td>
        <td ng-show="structure.tabs[2].selected">{{data.city}}</td>
        <td ng-show="structure.tabs[3].selected">{{data.designation}}</td>
    </tr>
</table>
<h1>Unique Values Table (per key)</h1>
<table border="1" width="100%" style="margin-top: 50px;">
    <tr>
        <th ng-repeat="header1 in structure.tabs" ng-show="header1.selected">{{header1.index}}</th>
    </tr>
    <tr>
        <td ng-repeat="(hk, hv) in structure.tabs" ng-show="hv.selected">
            <table border='1'>
                <tr ng-repeat="(dk, dv) in structure.info | unique:hv.filter">
                    <td>
                        <input ng-model="item" type="checkbox" ng-change="getCheckedValues(item,dv,hv.filter)">{{dv[hv.filter]}}
                    </td>
                </tr>
            </table>
            <br>
            <button  ng-click="getChecked(hv.filter)">Get Checked</button>
        </td>
    </tr>
  </table>
 </body>

</html>


{{option.index}
{{header.index}
{{data.name}
{{data.age}
{{data.city}
{{data.designation}
唯一值表（每个键）
{{header1.index}
{{dv[hv.filter]}


检查

app.js

var-app=angular.module（'myApp'，[]）；
app.controller（“myController”，函数（$scope，$log）{
$scope.sortColumn=“name”；
$scope.reverseSort=false；
$scope.sortData=函数（列）{
$scope.reverseSort=（$scope.sortColumn==列）！$scope.reverseSort:false；
$scope.sortColumn=列；
}
$scope.structure={
“选项卡”：[
{
“索引”：“名称”，
“过滤器”：“名称”，
“选定”：真
},
{
“索引”：“年龄”，
“过滤器”：“年龄”，
“选定”：真
},
{
“索引”：“城市”，
“过滤器”：“城市”，
“选定”：真
},
{
“索引”：“名称”，
“过滤器”：“名称”，
“选定”：真
}
],
“信息”：[
{
“名称”：“阿巴尔”，
“年龄”：“27岁”，
“城市”：“Ghaziabad”，
“名称”：“Php开发人员”
},
{
“名称”：“阿巴尔”，
“年龄”：“27岁”，
“城市”：“奥赫拉”，
“名称”：“Html开发人员”
},
{
“名称”：“Nishant”，
“年龄”：“25岁”，
“城市”：“德里”，
“名称”：“角度显影剂”
},
{
“名称”：“Amit”，
“年龄”：“30岁”，
“城市”：“诺伊达”，
“名称”：“Android开发者”
}
]
};
$scope.getChecked=函数（选项卡）{
警报（“需要获取键：“+tab”的所有选中值）；
}
});
app.filter（'unique'，function（）{
返回函数（arr，字段）{
var o={}，i，l=arr.length，r=[]；
对于（i=0；i，您可以执行以下示例：
index.html
<body ng-controller="myController">
<label ng-repeat="option in structure.tabs">
    <input type="checkbox" ng-model="option.selected">{{option.index}}
</label>
<table border="1" width="100%">
    <tr>
        <th ng-repeat="header in structure.tabs" ng-show="header.selected" ng-click="sortData(header.filter)">{{header.index}}</th>
    </tr>
    <tr ng-repeat="data in structure.info | orderBy:sortColumn:reverseSort">
        <td ng-show="structure.tabs[0].selected">{{data.name}}</td>
        <td ng-show="structure.tabs[1].selected">{{data.age}}</td>
        <td ng-show="structure.tabs[2].selected">{{data.city}}</td>
        <td ng-show="structure.tabs[3].selected">{{data.designation}}</td>
    </tr>
</table>
<h1>Unique Values Table (per key)</h1>
<table border="1" width="100%" style="margin-top: 50px;">
    <tr>
        <th ng-repeat="header1 in structure.tabs" ng-show="header1.selected">{{header1.index}}</th>
    </tr>
    <tr>
        <td ng-repeat="(hk, hv) in structure.tabs" ng-show="hv.selected">
            <table border='1'>
                <tr ng-repeat="(dk, dv) in structure.info | unique:hv.filter">
                    <td>
                        <input type="checkbox">{{dv[hv.filter]}}
                    </td>
                </tr>
            </table>
            <br>
            <button ng-click="getChecked(hv.filter)">Get Checked</button>
        </td>
    </tr>
</table>
</body>

<!DOCTYPE html>
<html ng-app="myApp">

 <head>
  <meta charset="utf-8" />
  <title>AngularJS Plunker</title>
  <script>document.write('<base href="' + document.location + '" />'); </script>
  <link rel="stylesheet" href="style.css" />
  <script data-require="angular.js@1.4.x" src="https://code.angularjs.org/1.4.12/angular.js" data-semver="1.4.9"></script>
 <script src="script.js"></script>
</head>

<body ng-controller="myController">
<h1>Filter Table</h1>
<label ng-repeat="option in structure.tabs">
    <input type="checkbox" ng-model="option.selected">{{option.index}}
</label>
<table border="1" width="100%">
    <tr>
        <th ng-repeat="header in structure.tabs" ng-show="header.selected" ng-click="sortData(header.filter)">{{header.index}}</th>
    </tr>
    <tr ng-repeat="data in structure.info | orderBy:sortColumn:reverseSort">
        <td ng-show="structure.tabs[0].selected">{{data.name}}</td>
        <td ng-show="structure.tabs[1].selected">{{data.age}}</td>
        <td ng-show="structure.tabs[2].selected">{{data.city}}</td>
        <td ng-show="structure.tabs[3].selected">{{data.designation}}</td>
    </tr>
</table>
<h1>Unique Values Table (per key)</h1>
<table border="1" width="100%" style="margin-top: 50px;">
    <tr>
        <th ng-repeat="header1 in structure.tabs" ng-show="header1.selected">{{header1.index}}</th>
    </tr>
    <tr>
        <td ng-repeat="(hk, hv) in structure.tabs" ng-show="hv.selected">
            <table border='1'>
                <tr ng-repeat="(dk, dv) in structure.info | unique:hv.filter">
                    <td>
                        <input ng-model="item" type="checkbox" ng-change="getCheckedValues(item,dv,hv.filter)">{{dv[hv.filter]}}
                    </td>
                </tr>
            </table>
            <br>
            <button  ng-click="getChecked(hv.filter)">Get Checked</button>
        </td>
    </tr>
  </table>
 </body>

</html>


安古拉斯普朗克
文件。写（“”）；
过滤表
{{option.index}
{{header.index}
{{data.name}
{{data.age}
{{data.city}
{{data.designation}
唯一值表（每个键）
{{header1.index}
{{dv[hv.filter]}


检查

app.js
var-app=angular.module（'myApp'，[]）；
app.controller（“myController”，函数（$scope，$log）{
$scope.sortColumn=“name”；
$scope.reverseSort=false；
$scope.sortData=函数（列）{
$scope.reverseSort=（$scope.sortColumn==列）！$scope.reverseSort:false；
$scope.sortColumn=列；
}
变量数组=[]
数组[“名称”]=[]；
数组[“年龄”]=[]；
数组[“指定”]=[]；
数组[“城市”]=[]；
$scope.getCheckedValues=函数（e、val、键）{
console.log（val）
如果（e）{
数组[key].push（e）
}否则{
数组[key].shift（）
}
}
$scope.structure={
“选项卡”：[
{
“索引”：“名称”，
“过滤器”：“名称”，
“选定”：真
},
{
“索引”：“年龄”，
“过滤器”：“年龄”，
“选定”：真
},
{
“索引”：“城市”，
“过滤器”：“城市”，
“选定”：真
},
{
“索引”：“名称”，
“过滤器”：“名称”，
“选定”：真
}
],
“信息”：[
{
“名称”：“阿巴尔”，
“年龄”：“27岁”，
“城市”：“Ghaziabad”，
“名称”：“Php开发人员”
},
{
“名称”：“阿巴尔”，
“年龄”：“27岁”，
“城市”：“奥赫拉”，
“名称”：“Html开发人员”
},
{
“名称”：“Nishant”，
“年龄”：“25岁”，
“城市”：“德里”，
“名称”：“角度显影剂”
},
{
“名称”：“Amit”，
“年龄”：“30岁”，
“城市”：“诺伊达”，
“名称”：“Android开发者”
}
]
};
$scope.getChecked=函数（选项卡）{
警报（“需要获取键：“+tab”的所有选中值）；
console.log（数组[选项卡]）
}
});
app.filter（'unique'，function（）{
返回函数（arr，字段）{
var o={}，i，l=arr.length，r=[]；
（i=0；i好的。为我先前的回答道歉我把问题搞砸了
无论如何，我花了将近一个小时试图解决这个问题，并设法使用$scope.$$watchers[0].last和下划线来完成
//this is how getChecked looks like now
$scope.getChecked = function(tab) {
    var selectedKey = tab.$$watchers[0].last;
    _.each($scope.structure.info,function(row){
        _(row).pairs().filter(function(item){
        _.each(item,function(key){
            if(key===selectedKey)
                {
                    console.log(row);
                    return;
                }
        })

    })
    })

上面的方法负责在控制台中识别密钥并在每次您在下表中选择密钥时吐出。所以请检查控制台
解决方案在KR下方
您希望复选框的值存储在哪里？现在只需提醒您希望它提醒的值是什么？这只不过是“这是一个具有一些相关功能的库，现在转到此链接并自己找到答案”。将其更改为“这是一个包含一些相关函数的库。下面是一些如何使用这些相关函数的示例。”…我想了解的是链接到外部内容并没有多大帮助。我