Javascript AngularJS fadein应用于第一个元素

我有一个ng repeat和list items的以下模板。我试图每次打开一个项目，并在单击时将其淡入。 现在只有第一个列表项淡入，即使所有项目都使用descHelp id。有什么想法吗

模板：

<div data-ng-repeat="parts in data track by $index">
  <li id="title" ng-click='setItem($index);'>
    <div  class="hblinks" ng-click="showDetails = ! showDetails; " >
      <span class="sb-text-title">the title</span>
    </div>
    <div id ="descHelp"  ng-show="showDetails && $index == itemIndex">

谢谢大家!

$element.find（“#descHelp”）

将仅返回具有该id的第一个元素，而不是所有元素。您应该使用类，id只能使用一次

您可以使用

ng if

而不是

ng show

来强制DOM中只存在一个id为workaround的div，但我不建议这样做

最好使用像id=“descHelp-{{$index}}”这样的$index对象构建一个唯一的id

$element.find（“#descHelp”）

将只返回第一个具有该id的元素，而不是全部。您应该使用类，id只能使用一次

您可以使用

ng if

而不是

ng show

来强制DOM中只存在一个id为workaround的div，但我不建议这样做

---

最好使用$index对象（如id=“descHelp-{{{$index}}”）构建唯一id

使用$index提供唯一id:

<div data-ng-repeat="parts in data track by $index">
  <li id="title" ng-click='setItem($index);'>
    <div  class="hblinks" ng-click="showDetails = ! showDetails; " >
      <span class="sb-text-title">the title</span>
    </div>
    <div id ="descHelp_{{$index}}"  ng-show="showDetails && $index == itemIndex">

---

使用$index指定唯一id：

<div data-ng-repeat="parts in data track by $index">
  <li id="title" ng-click='setItem($index);'>
    <div  class="hblinks" ng-click="showDetails = ! showDetails; " >
      <span class="sb-text-title">the title</span>
    </div>
    <div id ="descHelp_{{$index}}"  ng-show="showDetails && $index == itemIndex">

---

您不能有多个具有相同id的元素，请改用一个类。您不能有多个具有相同id的元素，请改用一个类。谢谢您，它在大多数情况下都能工作，但并不总是如此。例如，如果我展开折叠展开同一个元素，在第二次展开时，它不会淡入。谢谢你，它大部分时间都在工作，但并不总是如此。例如，如果我展开折叠展开同一个元素，在第二次展开时它不会淡入。

$scope.setItem=function(item, index) {
  $scope.itemIndex=item;
  var target = $element.find('#descHelp_' + index);
  target.fadeIn( 600 );
}