Как я могу добавить ng-click к уже объявленной панели навигации Ionic?

0

Работа с Ionic и AngularJS здесь.

Поэтому мое приложение представляет собой приложение с вкладками, а файл tabs.html выглядит примерно так:

<ion-view> 
    <ion-nav-bar class="bar-positive" align-title="center">
        <ion-nav-back-button>
        </ion-nav-back-button>
    </ion-nav-bar>
    <ion-tabs class="tabs-icon-top" ng-controller="TabsCtrl" ng-class="{'tabs-item-hide': hideTabs}">
        <ion-tab title="TITLE 1" href="#/tabs/page1">
            <ion-nav-view name="page1-tab"></ion-nav-view>
        </ion-tab>
        <ion-tab title="TITLE 2" href="#/tabs/ge2">
            <ion-nav-view name="ge2-tab"></ion-nav-view>
        </ion-tab>
        <ion-tab title="TITLE 3" href="#/tabs/page3">
            <ion-nav-view name="3-tab"></ion-nav-view>
        </ion-tab>
    </ion-tabs>
</ion-view>

Затем верхняя часть одной из страниц вкладок выглядит так:

<ion-view view-title="TITLE 1">
    <ion-nav-buttons side="left">
        <button class="button icon ion-search"></button>
    </ion-nav-buttons>
    <ion-nav-buttons side="right">
        <button class="button icon ion-compose"></button>
    </ion-nav-buttons>
    ...
    ...
    ...
</ion-view>

Я хочу добавить ng-click в view-title. Я добавил ng-click на ion-nav-bar но это отменяет щелчок на ion-nav-buttons в представлении.

Я просто хочу, чтобы он щелкнул, когда я попал в середину панели навигации на странице.

Любая помощь оценивается.

  • 0
    Событие бурлит. Итак, вам нужно остановить распространение. Вы можете сделать это с помощью $ event.stopPropagation (). Смотрите мои ответы от деталей.
Теги:
ionic-framework
cordova

2 ответа

2
Лучший ответ

Чтобы предотвратить вызов функции родительского ng-click, используйте stopPropagation:

$event.stopPropagation();

Это нужно вызвать в функции ng-click для дочернего элемента.

1

События разворачиваются от ребенка к родителям. Это аккуратная функция, которая иногда пригодится. Однако он также может создавать проблемы, подобные описанным вами. Чтобы этой проблемы не было, нам нужно убедиться, что событие click останавливается у ребенка и не пузырится. Добавьте эту строку в функцию ng-click:

$event.stopPropagation();

Для получения дополнительной информации о распространении событий: https://developer.mozilla.org/en-US/docs/Web/API/Event/stopPropagation

Это должно дать вам общее представление.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню