Как скрыть все div одного и того же класса, кроме первого класса в angularjs - PullRequest
0 голосов
/ 12 января 2019

Мне нужно скрыть все div, имеющие один и тот же класс, кроме первого. Вот у меня есть select, и div, чьи данные будут поступать при изменении select. заголовок «критический», кроме первого, аналогично мне нужно скрыть весь заголовок (h4) «основного», кроме первого, если его больше одного. Вот эти значения / id или класс могут меняться в зависимости от json. Мне нужно сделать в angularj. Может кто-нибудь, пожалуйста, помогите мне. Вот код. https://plnkr.co/edit/77PXskAuwtG0uAVsK1fz?p=preview

HTML

    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
    <body>
    <div ng-app="myApp" ng-controller="myCtrl">
    <select class="change" ng-model="x" ng-change="update()">
    <option value="condition">condition</option>
    </select>
    <div class="main">
<div  ng-repeat="emp in groups" ng-attr-id="{{emp[attr]}}">
<h4 class="{{emp[attr]}}">{{emp[attr]}}</h4>
<p class="values">{{emp[attr]}}</p>
</div>
</div>

SCRIPT

var app = angular.module("myApp", []);
app.controller("myCtrl", function($scope) {
$scope.groups = [
    {
      name: 'Malaria',
      symptom:'fever',
      categoty:'critical',
      id:'1'
    },

    {
      name: 'cancer',
      symptom:'diesease',
      categoty:'critical',
      id:'3'
    },
    {
      name: 'fever',
      symptom:'diesease',
      categoty:'critical',
      id:'3'
    },
    {
     name: 'Cold',
      symptom:'colds',
      categoty:'major',
      id:'2'
    }
    ]
  $scope.update = function() { 

   if($scope.x == 'condition'){
   $scope.id='categoty';
    $scope.attr = 'categoty';
   }

}
});

Ответы [ 3 ]

0 голосов
/ 12 января 2019

Насколько я понимаю, вы хотите уникальные объекты в массиве - на основе поля categoty (между прочим, должно быть "категория"). Поле должно быть всегда первым.

Итак, это должно работать:

  var groups = [{
    name: 'Malaria',
    symptom: 'fever',
    categoty: 'critical',
    id: '1'
  }, {
    name: 'cancer',
    symptom: 'diesease',
    categoty: 'critical',
    id: '3'
  }, {
    name: 'fever',
    symptom: 'diesease',
    categoty: 'critical',
    id: '3'
  }, {
    name: 'Cold',
    symptom: 'colds',
    categoty: 'major',
    id: '2'
  }]

  var existing = {};
  $scope.groups = groups.filter(function(entry) {
    if (existing[entry.categoty]) {
      return false;
    }
    existing[entry.categoty] = true;
    return true;
  });
0 голосов
/ 13 января 2019

Добавьте вторичный класс ко всем элементам div, на которые нужно повлиять, например, для стандартизации стиля, и используйте этот класс, чтобы повлиять на видимость.

<div class="status" ng-repeat="emp in groups" ng-attr-id="{{emp[attr]}}">
</div>

div.status:not(:first-child) {
  display: none;
}
0 голосов
/ 12 января 2019

Вы можете получить все экземпляры класса, кроме первого, используя селекторы Level3

div.class: нет (: первый-ребенок)

https://www.w3.org/TR/selectors-3/

Женитесь на этом с простой функцией js или директивой, как объяснено в ответе здесь https://stackoverflow.com/a/27639866/1020735

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...