Angular js:使用ng类过滤数据



我无法过滤MyJson数据"InstallationsDefaultTypes"请你有个主意。如何过滤mythenested JSON我只是用ng类来过滤它可能吗?

角度控制器:

$scope.GetDefaultByInstallation = function ()
{
$scope.installationsStates = [];
Object.keys($scope.installationsHelper).forEach(function (key)
{
var res = false;
angular.forEach($scope.installationsHelper[key].InstallationsDefautsTypes, function (value, key)
{
if (value.value == true)
{
res = true;
} 
});
$scope.installationsStates.push({
name: $scope.installationsHelper[key].InstallationsDefautsTypes.name,
state: res
});
});
}

page.chtml:这是我的页面html

<div class="row col-lg-12 col-md-12 col-sm-12 col-xs-12 stateDefaut">
<div class="row  col-lg-12 col-md-12 col-sm-12 col-xs-12 ">
<div ng-repeat="value in installationsHelper" class="col-lg-6 col-md-6 col-sm-6 col-xs-6 text-left">
<span ng-class="{value.InstallationsDefautsTypes.value | filter : value.InstallationsDefautsTypes.name = "Delestage"  ? 'mDefault' : 'mActive'}">
OUI
</span>
</div>
</div>
</div> 

JSON:

scope.installationsStates = [ {
Installations: {
id: 1
},
InstallationsDefautsTypes :
{
Delestage:
{
name: "Delestage", 
value : false, 
id: 1
}
defaut command:
{
name: "defaut1", 
value : false, 
id: 1
}
}
defaultsInstallations: {
0: "defaut",
1:Delestage
}
}]

根据我的理解,我根据的假设做了以下例子

<html ng-app="myApp">
<head>
<title></title>     
</head>
<body>
<div ng-controller="myController">
<div ng-repeat="value in installationsStates">
<span style="color: {{ value.InstallationsDefautsTypes.value ? 'red' : 'black' }};">
OUI
</span>
</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<script>
angular.module('myApp', []).controller('myController', function($scope) {
$scope.installationsStates = [
{
Installations: {
id: 1
},
InstallationsDefautsTypes : {
name: "Delestage", 
value : false, 
id: 1
},
defaultsInstallations: {
0:"defaut",
1:"Delestage"
}
},
{
Installations: {
id: 2
},
InstallationsDefautsTypes : {
name: "Delestage", 
value : true, 
id: 2
},
defaultsInstallations: {
0:"defaut",
1:"Delestage"
}
},
{
Installations: {
id: 3
},
InstallationsDefautsTypes : {
name: "Delestage", 
value : false, 
id: 3
},
defaultsInstallations: {
0:"defaut",
1:"Delestage"
}
},
];              
});
</script>
</body>
</html>

为了更好地理解ng repeat等,请访问此链接https://www.w3schools.com/angular/ng_ng-repeat.asp

希望它能帮助

最新更新