Ajouter ng-cliquez sur l'événement à angular-ui accordion

Je suis en utilisant angular-ui et ont commencé à utiliser des accordéons.

J'ai besoin de mettre le feu à un ng-click cas quand quelqu'un ouvre ou ferme un accordéon groupe.

J'ai fait quelques recherches et trouvé ce fil: angular-ui problème

- Il lié à un plunker qui montre une solution qui n'est pas satisfaisant pour mon cas d'utilisation.

Voici les solutions html:

<accordion>
  <accordion-group>
      <accordion-heading>
          <span ng-click="foo()">Try clicking me!</span>
      </accordion-heading>
      Some Body 3
  </accordion-group>
</accordion>

Cependant la ng-cliquez sur l'événement se déclenche uniquement si vous cliquez sur la plage de texte. Si vous cliquez à l'extérieur du texte de l'accordéon s'ouvre ou se ferme sans aucun événement click.

Pour corriger cela j'ai essayé de faire les travées de largeur & hauteur de 100% et réglage display: block.
J'ai aussi envisagé de retirer le rembourrage entièrement, mais je me demandais si il ya une meilleure façon que de piratage.

Personne ne sait comment fixer le ng-cliquez sur l'événement pour l'ensemble de l'accordéon groupe? Ou comment faire de la durée de remplissage de l'ensemble du groupe?

La totalité de mon code:

  <accordion close-others="true">
    <accordion-group ng-repeat="question in level">
        <accordion-heading style="padding: 0">
            <div style="display: block; margin: 0px" ng-click="set_question(question.title)">{{ question.title }}</div>
            <i class="icon-check" ng-show="has_solved_all"></i>
        </accordion-heading>
        <span ng-bind-html-unsafe="question.content"></span>
    </accordion-group>
  </accordion>
    <br>
    Question Open: {{ question_open }}
double possible de Poignée d'ouverture/de l'effondrement des événements de l'Accordéon dans Angulaire

OriginalL'auteur robert king | 2013-08-23

  1. 2

    Pourquoi avez-vous besoin ng-click solution spécifique? Il y a un is-open attribut que vous pouvez regarder pour, et qui déclenche à l'ouverture/fermeture d'un accordéon.

    Peut-être que je peux l'utiliser est-ouvert. Je suis à la recherche de la documentation maintenant. Mon problème, plus particulièrement, est j'ai une ng-repeat="question en question". Chaque question s'ouvre en accordéon. Puis en bas de la page il est dit de la question à laquelle vous êtes en train de visualiser.
    Ressemble à stackoverflow.com/a/15642577/860421. S'agit-il?
    oups - ressemble. Dans tous les cas, je pense que nous pouvons marquer cette question comme en double.
    est-ce une bonne idée d'utiliser $watch. Comme angulaire de ne pas encourager l'utilisation de $watch. comme nous sommes interfaring avec l'empreinte de cycle.

    OriginalL'auteur 0xc0de

  2. 0

    Créer un haut niveau de div en vertu de l'accordéon ou l'intitulé de la déplacer 

    <i class="icon-check" ng-show="has_solved_all"></i>

    à l'intérieur de l'élément div -

    <div style="display: block; margin: 0px"

    Cela devrait faire de la magie.
    Ci-dessous fonctionne pour moi-

    <accordion-group ng-repeat="group in groups" >
  <accordion-heading>
    <div ng-click="opened(group, $index)">
      <span>{{group.title}}</span>
    </div>
  </accordion-heading>
  {{group.content}}
</accordion-group>

    De modifier et de vérifier, dans le plunker http://plnkr.co/edit/B3LC1X?p=preview
    journal de la console.
    Je sais que la question est ancienne, mais d'autres peuvent se servir de cette réponse.

    OriginalL'auteur milkyway

  3. 0

    Si vous entend pour en ajouter un autre, cliquez avec le un existe de l'événement open. Je suggère d'ajouter la directive soufflet à l'intérieur de la balise:

    myApp.directive('functionClick',function(){
    return{
        restrict: 'E',
        terminal: true,
        controller: 'NameOfController',
         templateUrl: "templateFunctionClick.html",
        link: function($scope, $element, $attrs, $ctrl){
        }
    }

});

<accordion-group  is-open="status.open">
  <accordion-heading >
    {{headerName}}
    <function-click></function-click>
  </accordion-heading>
</accordion-group>

    Où l'templateFunctionClick.html:

    <a ng-click="$event.stopPropagation();clickMeFunction()" ><span>Click Me!</span> </a>

    assurez-vous d'ajouter $de l'événement.stopPropagation(); afin de ne pas l'appeler en même temps que le clic de toggelOpen().

    OriginalL'auteur haya