ionic structure error I am doing navigation fo...">
Geek Answers Handbook

"The ionNavBar controller required by the ionNavButtons directive cannot be found!" <ion navigation> ionic structure error

I am doing navigation for my ionic application using tabs:

 <ion-tab title="feed" icon="ion-social-rss" href="#/app/feed"> <ion-nav-view name="feed-tab"></ion-nav-view>

then when i add the name of this tab to the route

  .state('app.home', { url: '/feed', views: { 'feed-tab' : { templateUrl: 'templates/feed.html', controller: 'MainCtrl' } } })

I get this error "The controller" ionNavBar "required by the" ionNavButtons "directive cannot be found!"

Here is my menu.html with the back button:

 <ion-side-menus enable-menu-with-back-views="false"> <ion-side-menu-content> <ion-nav-bar class="my-bar"> <ion-nav-back-button id="my-back-button" class="button-clear"> <i class="ion-chevron-left"></i> </ion-nav-back-button> <ion-nav-buttons side="left"> <button class="button button-icon button-clear ion-navicon mybutton bot" menu-toggle="left"> </button> </ion-nav-buttons> <!-- <ion-nav-buttons side="right"> <a href="#" class="my-right-button"><i class="icon ion-funnel my-funnel"></i></a> </ion-nav-buttons> --> </ion-nav-bar> </ion-side-menu-content> <ion-side-menu side="left" class="sidemenu"> <div> <div> <a href="#/app/options" class="button-icon icon ion-ios-gear-outline options" menu-toggle="left"></a> </div> <hr class="longhr"> </div> <div class="all-projects"><h3>All Projects</h3></div> <div> <hr class="shorthr"> <div class="project"> <i class="ion-record icon-right icon-color-assertive my-circle-icon"></i> <h3>Super project</h3> <label>Subname</label> <ul type="disc"> <li>First category</li> <li>Second category</li> </ul> </div> </div> <section class="myseaction"> <hr class="shorthr"> <div class="project"> <i class="ion-record icon-right icon-color-assertive my-circle-orange-icon"></i> <h3>One more project</h3> <label>Subname</label> <ul type="disc"> <li>First category</li> <li>Second category</li> </ul> <label>Subname</label> <ul type="disc"> <li>Third category</li> <li>Fourth category</li> </ul> </div> </section> </ion-side-menu> </ion-side-menus> <ion-tabs class="tabs-icon-top" id="tab"> <ion-tab title="feed" icon="ion-social-rss" href="#/app/feed"> <ion-nav-view name="feed-tab"></ion-nav-view> </ion-tab> <ion-tab title="selected" icon="ion-ios-star-outline" href="#/tab/list"> <ion-nav-view name="selected-tab"></ion-nav-view> </ion-tab> <ion-tab title="actions" icon="ion-ios-list-outline" href="#/tab/actions"> <ion-nav-view name="actions-tab"></ion-nav-view> </ion-tab> <ion-tab title="charts" icon="ion-arrow-graph-up-right" href="#/tab/charts"> <ion-nav-view name="charts-tab"></ion-nav-view> </ion-tab> <ion-tab title="more" icon="ion-more" href="#/tab/more"> <ion-nav-view name="more-tab"></ion-nav-view> </ion-tab> </ion-tabs>

this is my feed.html header:

 <ion-view> <ion-nav-buttons side="right"> <a href="#/app/feed-filter" class="my-right-button"><i class="icon ion-funnel my-funnel"></i></a> </ion-nav-buttons> <div class="bar bar-subheader item-input-inset bar-light mysearchbar"> <label class="item-input-wrapper"> <i class="icon ion-search placeholder-icon"></i> <input type="search" ng-model="query" placeholder="Search"> </label> </div>

and this is my index.html:

  <body ng-app="starter"> <ion-nav-view></ion-nav-view>

I have a test application when I use these tabs and everything is fine, I can’t understand why I get this error?

+5
source share

No one has answered this question yet.

See related questions:

More articles:


All Articles