Angular2 Cliquable ligne du tableau, à l'exception de la dernière cellule

J'ai une table avec les données, et ma dernière cellule est un bouton supprimer pour supprimer une ligne.

Le problème que je me pose, c'est que mes lignes sont cliquables qui me prennent pour une autre page pour modifier l'élément, et donc quand je clique sur le bouton supprimer, il supprime l'élément, mais aussi me ramène à la page d'édition.

Voici mon code :

<table class="data-table-format">
  <thead>
    <tr>
      <th>id</th>
      <th>Maker</th>
      <th>Model</th>
      <th>Year</th>
      <th></th>
    </tr>
  </thead>
  <tbody>
    <tr *ngFor="let car of pagedItems" (click)="editCar(car)">
      <th>{{ car.car_id }}</th>
      <td>{{ car.car_maker }}</td>
      <td>{{ car.car_model }}</td>
      <td>{{ car.car_year }}</td>
      <td><i class="material-icons" style="color:red" (click)="deleteCar(car.car_id)">delete_forever</i></td>
    </tr>
  </tbody>
</table>

Toute suggestion sur la façon de faire angulaire/tapuscrit ?

  • Avez-vous essayé event.stopPropagation();?
  • est que jQuery ? Je voudrais éviter de jQuery si c'est possible
  • DOUBLE question réponse ici
  • Ou à l'aide de css pointer-events: none
  • en fait c'est exactement la même question et la réponse a travaillé pour moi, juste essayé. Mais ne pouvait pas trouver sa question que le titre de la question n'était pas évident pour moi
  • totalement comprensible, n'était pas facile à regarder pour.

InformationsquelleAutor Imad El Hitti | 2017-06-02
  1. 19

    Vous pouvez essayer cette. Ce n'est pas jQuery 

     <tbody>
    <tr *ngFor="let car of pagedItems" (click)="editCar(car)">
      <th>{{ car.car_id }}</th>
      <td>{{ car.car_maker }}</td>
      <td>{{ car.car_model }}</td>
      <td>{{ car.car_year }}</td>
      <td><i class="material-icons" style="color:red" (click)="$event.stopPropagation();deleteCar(car.car_id)">delete_forever</i></td>
    </tr>
  </tbody>
    • Merci a parfaitement fonctionné
    • cela a déjà été résolu dans les commentaires, c'est une double question. Je vous remercie pour votre effort.
    • Juste ce dont j'avais besoin. Merci
    InformationsquelleAutor sainu