Question

除了第一个类，我需要隐藏所有具有相同类的div。在这里，我有一个select，并且一个div的数据将随着select的变化而变化。当我们选择时，critical和major都会出现。除了第一个以外的'critical'的标题，类似地，如果第一个以外的'major'的所有标题（h4）不止一个，我需要将其隐藏。我需要在angularjs中做。有人可以帮我吗？这是代码。 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>

脚本

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';
   }

}
});

Answer 1

您可以使用Level3选择器获得该类的所有实例，但第一个除外。

div.class：not（：第一个孩子）

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

使用简单的js函数或指令（如此处的答案https://stackoverflow.com/a/27639866/1020735

所述）对此进行嫁接

Answer 2

据我了解，您想要数组中的唯一对象-基于字段categoty（顺便说一下，应该是“ category”）。产生的字段应该始终是第一个。

所以，这应该起作用：

  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;
  });

Answer 3

向所有受影响的div元素添加一个辅助类，例如用于样式的标准化，并使用该类来影响可见性。

ttyf

如何在angularjs中隐藏除第一类外的所有相同类的div

HTML

脚本

3 个答案: