1

Currently I facing the problem in showing div once I click on the ion-nav-buttons. Below is the coding.

    <ion-nav-buttons side="secondary">
        <button class="sec_button_text button button-icon" style="font-weight:600" ng-click="inputShow = !inputShow">Search</button>
    </ion-nav-buttons>
    <ion-content style="margin-top:5px;">
      <div style="padding: 10px;" ng-show="inputShow">
          <input id="searchInput" type="text" placeholder="Search" ng-model="search">
      </div>
    </ion-content>
Tss
  • 88
  • 4
  • 13

1 Answers1

0

You are placing the trigger (button) and the element to be triggered (ion-content) in separate scopes. ion-nav-buttons and ion-content are directives and they have their own scope so you can't control the ng-show from out of scope.

For a solution you will need to set and change the inputShow variable in a scope and depending on wether you have the nav-buttons and content in under the same controller it will work straight away or you will need to broadcast/emit the change. There is always the option to bind the inputShow in rootScope but it's not the best solution.

thepio
  • 6,193
  • 5
  • 35
  • 54