Home / Questions / 141622
Accepted
zerokira
Asked: 2020-02-27 11:34:32 +0800 CST 2020-02-27 11:34:32 +0800 CST

Show Item if True in Array Json

  • 772

How do I show the content of a person if at least one of those itemswithin arrayhas the status denied, this is my código.

index.html

<!doctype html>
<html lang="en">

<head>
  <meta charset="utf-8">
  <title>Refinanciador</title>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
  <script src="app.js" charset="utf-8"></script>
</head>

<body ng-app="app">
      <div class="row" ng-controller="appController">
          <h1> FUTBOLISTAS </h1>
           <ul>
              <li ng-repeat="data in datos">
                  <p>Nombre: {{ data.nombre }} <br /> Apellido: {{ data.apellido }}</p> <br /> Estado: {{ data.status }}
              </li>
          </ul>
          <div ng-if="showPersonDenied" style="width: 100px; height: 100px; background-color: red; text-align: center;">
              Aca va una eprsona con estado denegado
          </div>
       </div>
 </body>
</html>

</body>

</html><br><br>

app.js

var app = angular.module("app", []);

app.controller("appController", function ($scope, $http) {
   //vamos a hacer uso de $http para obtener los datos
   $http.get('data.json').then(function (data) {
   //enviamos los datos a la vista con el objeto $scope
   $scope.datos = data.data;
   $scope.personStatus = $scope.datos;

   if ($scope.personStatus.length){
        for (var i = 0; i < $scope.personStatus.length ; i++) {
            $scope.showPersonDenied = $scope.personStatus[i].status === 'denied';
        }
    }

 });   
})<br><br>

data.json

[
   {
      "nombre": "James",
      "apellido": "Rodrigez",
      "status": "approved"

   },
   {
      "nombre": "Zlatan",
      "apellido": "Ibrahimovic",
      "status": "denied"

   },
   {
      "nombre": "Lionel",
      "apellido": "Messi",
      "status": "approved"

   }
]


the idea is that this variable $scope.showPersonDenied is true if any of the itemsinside arrayhas thestatus == 'denied'

javascript

2 Answers

  1. Best Answer

    If you want to list ONLY the ones with the status deniedyou can use$filter 

    $scope.personStatus = $scope.datos;
$scope.personDenied = $filter('filter')($scope.personStatus, { status: "denied" });

    And you just make one ng-repeatof your array $scope.personDeniedlike this:

    <li ng-repeat="usuarios in personStatus" ng-show="personDenied.length > 0">

    This way you control that if there are none, the list is not shown with ng-show.

    • 3

  2. Well you just have to add an ng-if to validate the condition, it should look like this:

    <li ng-repeat="data in datos" ng-if="data.status == 'approved'">...<li>

    Here you can read a bit more about ng-if: ng-if

    • 0