Подтвердить что ты не робот

Кнопка внутри метки с вводом не вызывает ng-click

Что мой код:

<label class="item item-input " style="height: 10%" ng-click="publish()">
<input type="text" placeholder="Title" ng-model="title">
<i ng-click="publishBlog()" class="button button-clear icon ion-paper-airplane padding-right"></i>
</label>

"publish()" может быть запущен, но не "publishBlog()". Ионный будет помещать значок в. Ионная причина?

Ответ 1

в теге label (метка) ваше событие click не будет работать, потому что метка переопределяет нажатие кнопки.

используйте DIV вместо метки, который будет работать нормально.

Ответ 2

Как Hardy, вам нужно использовать div вместо label. Но вам нужно будет использовать $event.stopPropagation();, чтобы удостовериться, что вызван только publishBlog(). Без $event.stopPropagation(); обе функции будут вызваны.

Итак, здесь пример реализации:

<ion-content class="padding" ng-controller="my">
    <div class="item item-input " style="height: 10%" ng-click="publish($event)">
        <input type="text" placeholder="Title" ng-model="title">
        <i ng-click="publishBlog($event)" class="button button-clear icon ion-paper-airplane padding-right"></i>
    </div>
</ion-content>

И ваш контроллер:

.controller("my", function($scope){  
    $scope.publish = function($event) {
        alert("title");
    };
    $scope.publishBlog = function ($event) {
        $event.stopPropagation();
        alert("icon");
    };    
});

Вот демо: http://play.ionic.io/app/1b82ce25ca44