2015-08-26 1 views
0

Работа с ионным и угловымJS здесь.Как добавить ng-click в уже объявленную панель ввода Ionic?

Так что мое приложение является вкладками приложений и мой файл 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(). См. Мои ответы из деталей. – superczan

ответ

2

Чтобы предотвратить функцию нг щелчка родительскую от вызова, использовать stopPropagation:

$event.stopPropagation(); 

Это должно быть названо в функции нг-клик ребенка.

1

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

$event.stopPropagation(); 

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

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

Смежные вопросы