After migration Im always receiving following error:
Controller ‘ionNavBar’, required by directive ‘ionNavBackButton’, can’t be found!
After migration Im always receiving following error:
Controller ‘ionNavBar’, required by directive ‘ionNavBackButton’, can’t be found!
Hmm cant figure this out. Can you give more detail. Your markup and controller.
My menu:
<ion-nav-bar class="bar-light nav-title-slide-ios7">
<!-- <ion-nav-back-button class="button-clear"><i class="icon ion-chevron-left"></i> {{ 'BACK' | translate }}</ion-nav-back-button> -->
</ion-nav-bar>
<ion-nav-view name="menuContent" animation="slide-left-right"></ion-nav-view>
<header class="bar bar-header bar-light">
<h1 class="title"><img class="logo" ng-src="./img/ilq-logo.svg" alt="Ilikeq logo"></h1>
</header>
<ion-content class="has-header bg-white">
<ion-list>
<ion-item nav-clear menu-close href="#/app/people">
<i class="ion-person-stalker menu-left_icon"></i> {{ 'PEOPLE' | translate }}
</ion-item>
<ion-item nav-clear menu-close href="#/app/notifications">
<i class="ion-ios7-bell menu-left_icon"></i> {{ 'NOTIFS' | translate }}
<span class="bubble-notification" ng-if="$root.unread_notifs > 0">
{{$root.unread_notifs}}
</span>
</ion-item>
<ion-item nav-clear menu-close href="#/app/like">
<i class="ion-thumbsup menu-left_icon"></i> {{ 'LIKE_GAME' | translate }}
</ion-item>
<ion-item nav-clear menu-close href="#/app/rate" ng-hide="hideRate">
<i class="ion-arrow-graph-up-right menu-left_icon"></i> {{ 'RATE_GAME' | translate }}
</ion-item>
<ion-item nav-clear menu-close href="#/app/date" ng-hide="hideDate">
<i class="ion-ios7-wineglass menu-left_icon"></i> {{ 'DATE_GAME' | translate }}
</ion-item>
<ion-item nav-clear menu-close href="#/app/conversations">
<i class="ion-email menu-left_icon"></i> {{ 'MESSAGES' | translate }}
<span class="bubble-notification" ng-if="$root.unread_conversations > 0">
{{$root.unread_conversations}}
</span>
</ion-item>
<ion-item nav-clear menu-close href="#/app/me">
<i class="ion-person menu-left_icon"></i> {{ 'YOUR_PROFILE' | translate }}
</ion-item>
<ion-item nav-clear menu-close href="#/app/terms" ng-hide="hideTerms">
{{ 'TERMS' | translate }}
</ion-item>
</ion-list>
</ion-content>
My view:
<ion-nav-buttons side="left">
<button menu-toggle="left" class="button button-icon icon ion-navicon"></button>
</ion-nav-buttons>
<ion-nav-buttons side="right">
<ion-nav-back-button class="button-clear"><i class="icon ion-chevron-left"></i> {{ 'BACK' | translate }}</ion-nav-back-button>
<button class="button button-small button-assertive headerFilter" ng-click="openFilters()">
<i class="icon ion-arrow-down-b"></i> {{ 'FILTERS' | translate }}
</button>
</ion-nav-buttons>
<ion-content class="has-header content-padding preserve3d" home-resize>
<div id="in-app-purchase-list"></div>
<div class="space-l">
<fieldset class="switch switch-three">
<input type="radio" ng-model="searchTypeValue" value="all" name="select" id="optone" ng-change="searchType(searchTypeValue)" />
<label for="optone">{{ 'ALL' | translate }}</label>
<input type="radio" ng-model="searchTypeValue" value="near" name="select" id="optthree" ng-change="searchType(searchTypeValue)" />
<label for="optthree">{{ 'NEAR' | translate }}</label>
<input type="radio" ng-model="searchTypeValue" value="top" name="select" id="opttwo" ng-change="searchType(searchTypeValue)" />
<label for="opttwo">{{ 'TOP' | translate }}</label>
<span class="switch-button"></span>
</fieldset>
</div>
<div class="row row-fullWidth space-l">
<div ng-repeat="piar in columns" ng-class="(homeAnimated === true && $root.animations === true) ? 'is-animated anm-column anm-fadeInDown' : ''" class="col">
<div ng-repeat="user in piar">
<div class="card user-card">
<a class="block_link bg-graylight" href="#/app/user/{{user.id}}">
<img class="responsiveImage fullWidth borderRadius-s overflow-hidden"
ng-src="http://{{user.profile_picture.href}}"
image-on-load>
<div class="profile-name">
{{user.nickname}}, {{user.age}}
</div>
</a>
<div class="u-relative">
<button class="button button-small button-assertive" ng-click="like(user.id, $event)">
<i class="ion-thumbsup buttonIcon buttonIcon-m"></i> {{ 'LIKE' | translate }}
</button>
<span class="status-online cGray" ng-if="user.is_online"></span>
</div>
</div>
</div>
</div>
</div>
<div class="noData" ng-show="!hasDataUsers">Oops! We don't have any data yet. Please try again.</div>
<button class="button button-assertive fullWidth" ng-click="more()">
{{ 'MORE_PEOPLE' | translate }} <i class="ion-arrow-right-c buttonIcon buttonIcon-m"></i>
</button>
<div class="space-moreBottom"></div>
</ion-content>
Hi @dharmoslap, i think it’s because <ion-nav-back-button>
directive isn’t inside a <ion-nav-bar>
.
You should have something like:
<ion-nav-bar>
<ion-nav-back-button></ion-nav-back-button>
</ion-nav-bar>
Hope it helps!
Can you give more information about “translate”?
How to do multilingual app?