Comment développer l'effondrement lors de l'ouverture de la page en utilisant angulaire?

Question

Scénario

Je suis en train de faire l'effondrement d'élargir ouvert lorsque la page a commencé.

J'ai 2 parties de code HTML, l'une est des icônes et la fonction de clic associée dans le code angulaire. la deuxième partie de HTML est la partie de données montrant les données après le clic.

et la fonction d'expansion permet un commutateur d'ouverture entre plus ou moins.

question est de savoir comment le faire rester ouvert lorsque la page est chargée. ? J'ai essayé le nombre de façons de le faire, mais il reste collapse. \

veuillez faire une suggestion, ce qui ne va pas avec la méthode.

code

HTML

<td uib-tooltip="{{a.s.length}} s" tooltip-enable="a.s.length > 1" tooltip-append-to-body="true" tooltip-placement="left"> 
      <span class="auc-table__s-moreless-place"> 
       <span class="glyphicon glyphicon-plus pointer" aria-hidden="true" ng-if="a._sExpanded + 1 < a.s.length" ng-click="expandCollapses(a, true)" uib-tooltip="Show more" tooltip-append-to-body="true"></span> 
      </span> 
      <span class="auc-table__s-moreless-place"> 
       <span class="glyphicon glyphicon-minus pointer" aria-hidden="true" ng-if="a._sExpanded" ng-click="expandCollapses(a, false)" uib-tooltip="Show less" tooltip-append-to-body="true"></span> 
      </span> 
     </td> 

données HTML

<tr ng-if="a._sExpanded" ng-repeat="b in a.s.slice(1, a._sExpanded + 1)"> 
     <td></td> 
     <td></td> 
     <td></td> 
     <td></td> 
     <td></td> 
     <td>{{ bcv('Firm', a, b) }}</td> 
     <td></td> 
     <td class="auc-table__col--auc-table__col--numbers">{{ b.volume }}</td> 
     <td class="auc-table__col--auc-table__col--numbers">{{ bcv('Price', a, b) }}</td> 
     <td> 
      <span class="glyphicon glyphicon-edit pointer modify margin" uib-tooltip="Modify Order" aria-hidden="true" ng-if="::bcv('canModify', a, b)" ng-click="openDialog(a, b)"></span> 
      <span class="glyphicon glyphicon-remove pointer cancel margin" uib-tooltip="Cancel Order" aria-hidden="true" ng-if="::bcv('canCancel', a, b)" ng-click="cancel(a, b)"></span> 
     </td> 
     <td></td> 
    </tr> 

angulaire

$scope.expandCollapses = function (auc, expand) { 
     var pageSize = $scope.sScroll.pageSize; 
     var expanded = auc._sExpanded || 0; 
     var ls = auc.s && auc.s.length || 0; 


     // expanded += pageSize - (expanded ? 0 : 1); 


     if (expand) { 
      if (expanded + 1 < ls) { 
       expanded += pageSize - (expanded ? 0 : 1); 

       console.log("open"); 

      } 
     } 
     else { 
      if (expanded) { 
       if (expanded - ls >= pageSize) { 
        expanded = Math.ceil(ls/pageSize) * pageSize; 
       } 

       expanded = (expanded >= pageSize) ? expanded - pageSize : 0; 
       console.log("close " + expanded); 

      } 
     } 

     auc._sExpanded = expanded; 
    }; 

Answer 1

Si je comprends bien, vous j Voulez-vous ouvrir et fermer du texte en cliquant sur des icônes, n'est-ce pas?

Par exemple:

<tr ng-repeat-start="item in items"> 
    <td ng-click="item.moreIsShown = !item.moreIsShown">Show more</td> 
</tr> 
<tr ng-repeat-end ng-show="item.moreIsShown"> 
<td>Some extra data</td> 
</tr> 

Pour basculer la visibilité Vous n'avez pas besoin d'une fonction spéciale, il suffit de jouer en ligne.

Pour que cela fonctionne, je pense que vous devez définir l'attribut que vous souhaitez activer dans votre collection répétée.

Par exemple:

angular.forEach($scope.yourCollection, function(item) { 
item.moreIsShown = false; 
}); 

J'espère que j'ai bien compris votre question et j'espère que cela aide.