Ionic：区分列表项和列表项中的按钮-Java 学习之路

我创建了一个列表，其中包含右侧包含按钮的项目 . 我写了两个不同的功能，一个用于直接处理项目，另一个用于右边的按钮 .

问题是单击按钮结果调用这两个函数 .

如何编辑.html（或者如果不可能，然后是.js），以便点击项目（不包括按钮区域）将调用一个函数，单击右键将调用另一个函数 .

HTML：

<ion-list>
        <ion-item ng-repeat='item in list' class='list-group-item' 
            item="item"
            ng-click="clicker(item)" >
            <a class="item item-button-right">
                <h2>Item {{item.id}}</h2>
                <div class="buttons">
                    <button class="button button-assertive" ng-click="onRemoveClick(item)">
                    <i class="icon icon ion-close"></i>
                    </button>
                </div>
            </a>
        </ion-item>
    </ion-list>

AngularJS：

angular.module('ionicApp', ['ionic'])

.controller('list_controller', function($scope) {

    $scope.clicker = function(item){
    alert('Item Clicked: '+item.id)
};

    $scope.onRemoveClick = function(item){
    alert('Remove Clicked: '+item.id)
};

$scope.list = [
    { id: 1 },
    { id: 2 },
    { id: 3 },
    { id: 4 },
    { id: 5 }
];

});

1 回答

你可以使用stopPropagation . 以下示例

View

ng-click="onRemoveClick(item, $event);"

$scope.onRemoveClick = function (item, $event) {
     $event.stopPropagation();
 }

回复于 2024-05-26T16:54:35+08:00

Ionic：区分列表项和列表项中的按钮

1 回答

相关问题