У меня есть событие клика в строке таблицы, и в этой строке также есть кнопка удаления с кликом события. Когда я нажимаю кнопку «Удалить», также запускается событие «Событие» в строке.
Вот мой код
<tbody>
<tr ng-repeat="user in users" class="repeat-animation" ng-click="showUser(user, $index)">
<td>{{user.firstname}}</td>
<td>{{user.lastname}}</td>
<td>{{user.email}}</td>
<td><button class="btn red btn-sm" ng-click="deleteUser(user.id, $index)">Delete</button></td>
</tr>
</tbody>
Как я могу предотвратить showUser
запуск события, когда я нажимаю кнопку удаления в ячейке таблицы?
javascript
angularjs
angularjs-ng-click
michael_knight
источник
источник
ng-click
функции обработчика:ng-click="deleteUser(user.id, $event)"
.$event.preventDefault()
, иначе$event.stopPropagation()
при нажатии кнопки при звонке меня перенаправляли в корень моего приложения.Дополнение к ответу Стьюи. В случае, когда ваш обратный вызов решает, должно ли распространение быть остановлено или нет, я счел полезным передать
$event
объект обратному вызову:И затем в самом обратном вызове вы можете решить, следует ли остановить распространение события:
источник
Я написал директиву, которая позволяет ограничивать области, в которых действует клик. Он может быть использован для определенных сценариев, подобных этому, поэтому вместо того, чтобы иметь дело с кликом в каждом конкретном случае, вы можете просто сказать, что «щелчки не будут исходить из этого элемента».
Вы бы использовали это так:
Имейте в виду, что это предотвратит все нажатия на последнюю ячейку, а не только на кнопку. Если это не то, что вы хотите, вы можете обернуть кнопку следующим образом:
Вот код директивы:
источник
ngClick
, поскольку я на самом деле никогда не хочу распространять уже обработанное событие.ignoreNgClick=true
к событию и обработать его ... как-нибудь. В идеале, в оригинальнойngClick
директиве, но изменение звучит грязно.В случае, если вы используете директиву, подобную мне, вот как это работает, когда вам нужно двухстороннее связывание, например, после обновления атрибута в любой модели или коллекции:
Теперь вы можете легко использовать его в любой кнопке, ссылке, div и т. Д., Например так:
источник
источник