Cliquez sur la Rangée de Table pour Déclencher une Case à cocher, Cliquez en Angularjs

J'ai un tableau simple dans une application Angularjs qui contient une case à chaque ligne.

<table>
    <tr ng-repeat="obj in objList">
        <td>
            <input type="checkbox" ng-model="selectedObjs" value="{{obj}}"
                         ng-checked="obj.selected" 
                         ng-click="toggleObjSelection(obj.description)">
                {{obj.description}}
            </input>
        </td>
    </tr>
</table>

Est-il un moyen dans Angularjs pour permettre à l'utilisateur de cliquer n'importe où à l'intérieur de la ligne pour déclencher la case cliquez une fois?

Si l'utilisateur clique dans la case, nous ne voulons pas déclencher le clic de sorte qu'il semble que la case à cocher, cliquez a été déclenchée deux fois.

Cet article (http://www.learningjquery.com/2008/12/quick-tip-click-table-row-to-trigger-a-checkbox-click/) explique comment le faire en jQuery, mais est-il un moyen de faire cela en utilisant Angularjs style?

Vous pouvez utiliser délégué

OriginalL'auteur Delvin Defoe | 2014-09-17

  1. 13

    Vous êtes assez proche, vous avez juste besoin de stopPropagation sur l'objet $event:

    <table ng-controller="ctrl">
<tr ng-click="rowClicked(obj)" ng-repeat="obj in objList">
    <td>
        <input type="checkbox" ng-model="selectedObjs" value="{{obj}}"
                     ng-checked="obj.selected" 
                     ng-click="toggleObjSelection($event, obj.description)">
            {{obj.description}}
        </input>
    </td>
</tr>
</table>

    Et le JS:

    angular.module('myApp', [])
   .controller('ctrl', function($scope) {
   $scope.objList = [{
       description: 'a'
   },{
       description: 'b'
   },{
       description: 'c'
   },{
       description: 'd'
   }];

   $scope.toggleObjSelection = function($event, description) {
        $event.stopPropagation();
       console.log('checkbox clicked');
   }

   $scope.rowClicked = function(obj) {
       console.log('row clicked');
       obj.selected = !obj.selected;
   };
});

    http://jsfiddle.net/Ljwv0toh/7/

    Liés à la question: AngularJS ng-cliquez sur stopPropagation

    Cela a fonctionné parfaitement, sauf dans la fonction $scope.rowClicked() j'ai changé obj.selected = true; à obj.selected = !obj.selected;.
    Heureux que cela a fonctionné et j'ai approuvé votre edit -- a du sens. Pourriez-vous accepter la réponse?

    OriginalL'auteur Daniel