Comment conserver le dernier accordéon ouvert dans un groupe en invoquant la fonction dans l'attribut is-open
j'ai un accordéon qui est peuplé dynamiquement.
<accordion-group ng-repeat="data in dataList" is-open="isAccordionOpen(data.dataName)">
<accordion-heading>
<span ng-click="openedAccordionGroup(data.dataName)" class="accordionSpan"><b>{{data.dataName}}</b>
</span>
</accordion-heading>
</accordion-group>
ici dataList continuer à changer après 15 secondes ce qui signifie que je suis peuplé dataList après inteval régulier de 15sec. Donc je dois persister dans le dernier groupe d'accordéon ouvert. DataList peut être très hude. Donc je ne peux pas analyser et Modifier pour éviter l'invocation de méthode dans l'attribut is-open.
dans le fichier js, ' m ayant le code suivant.
$scope.openedAccordionName = '';
$scope.isAccordionOpen = function(name){
return $scope.openedAccordionName === name;
};
$scope.openedAccordionGroup = function(name) {
$scope.openedAccordionName = name;
};
quand je suis l'exécuter, c'est donner une erreur javascript.
Error: [$compile:nonassign] Expression 'isAccordionOpen(data.dataName)' used with directive 'accordionGroup' is non-assignable!
Qu'est-ce qui ne va pas dans le code ci-dessus?
1 réponses
vous ne pouvez pas vraiment faire cela parce qu'angular est à la recherche d'une variable de liaison à deux voies qu'il peut assigner. Vous pouvez facilement maintenir le dernier ouvert en utilisant track by
dans votre ng-repeat. Avec ce qui se passe est angulaire ne va pas recréer l'élément DOM, au lieu de cela, il va juste mettre à jour la portée de l'élément existant qu'il identifie en fonction de ce que vous suivez par.
ici dans l'exemple j'ai un id pour accordéons donc je le traque par id: -
<accordion-group ng-repeat="data in dataList track by data.id" is-open="isOpen">
par défaut si aucune piste fournie angular va ajouter un id unique $$hashKey
pour les éléments répétés et puisque vous êtes rafraîchissant dans une liste entière, il va supprimer les éléments de DOM et de les recréer. L'utilisation de track by you améliorera également votre performance. Vous pouvez fournir n'importe quelle clé unique comme valeur trackby (événement dataName
si elle est unique).
dans cet exemple, vous pouvez voir que le dernier accordéon est conservé ouvert même si vous rafraîchissez les données puisque le isOpen
est ajouté sur le champ enfant de l'élément répété même si vous rafraîchissez les données si ne mettra à jour les données basées sur l'id, il ne recréera pas l'accordéon.