Slider content or view not changing based on menu click - html

Question

I am new to Ionic and I am struck by this issue.
My issue is if I select any menu from {{menu.menuName}} then it will slide to respective tab but this will happen only if I am in app/home other than this URL above condition will not work.Please help.
menu.html
<ion-side-menu side="left">
<ion-header-bar class="bar-balanced">
<h1 class="title">App</h1>
</ion-header-bar>
<ion-content>
<ion-list>
<ion-item menu-close href="#/app/home">
<i class="icon ion-home"></i> Home
</ion-item>
<ion-item menu-close ng-click="createDirectory()">
<i class="icon ion-android-create"></i> Create Name
</ion-item>
<ion-list ng-controller="HomeCtrl">
<div ng-repeat="menu in mainMenu ">
<ion-item class="item-stable"
ng-click="toggleGroup(menu)"
ng-class="{active: isGroupShown(menu)}" style="color:#11c1f3;">
{{menu.menuName}} <i class="icon" style="position: absolute;
right: 8%;" ng-class="isGroupShown(menu) ? 'ion-minus' : 'ion-plus'"></i>
</ion-item>
<ion-item class="item-accordion"
ng-repeat="($index, directories) in directoryList"
ng-class="{'': $index === current}"
ng-click="changeSlide($index,directoryList)"
ng-show="isGroupShown(menu)" style="color:#E47006;" >
{{directories.directoryName}}
</ion-item>
</div>
</ion-list>
</ion-list>
</ion-content>
Controller.js
$scope.changeSlide = function (index,directoryName)
{
console.log('Slide changed to ' + index);
var data= directoryName[index]
if(data !=null){
var directoryId =data.directoryId;
data.dirId = directoryId;
getImages();
function getImages() {
userService.getImages(data).then(function(response) {
$scope.imageData = response;
$scope.current = index;
$ionicSlideBoxDelegate.slide(index);
},function(error) {
})
}
}
$scope.ready.push(index + ': ' + true);
};
app.js
.config(function($stateProvider, $urlRouterProvider) {
$stateProvider
.state('app.home',{
url:'/home',
cache:false,
views:{
'menuContent':{
templateUrl:'templates/home.html',
controller:'HomeCtrl'
}
}
})
.state('app.profileUpdate',{
url:'/profileUpdate',
cache:false,
views:{
'menuContent':{
templateUrl:'templates/profileUpdate.html',
controller:'ProfileUpdate'
}
}
});
$urlRouterProvider.otherwise('/app/home');
});
home.html
<ion-view view-title="Home" hide-back-button="true" style="margin-top: 45px;">
<ion-content scroll="false" style="top:0px;" >
<ion-slide-box slide-tabs-scrollable="true" show-pager="false" on-slide-changed="changeSlide(index,directoryList)" bounce="false" ion-slide-tabs>
<ion-slide ng-repeat="(key, catg) in directoryList" ion-slide-tab-label="{{catg.directoryName}}" style="background-color:white;">
<br><br>
<div class="row gallery">
<div class="col col-33" ng-repeat="element in imageData" ng-click="showImages($index)">
<img ng-src="data:image/jpeg;base64,{{element.imagePath}}" width="100%" />
</div>
</div>
<center ng-if="!ready[key]">
<br>
<ion-spinner></ion-spinner>
</center>
<br></br><br></br><br></br>
</ion-slide>
</ion-slide-box>
</ion-content>
</ion-view>

Answer 1

I have changed methods as mentioned below, I am adding this if in case anyone needs,
fetchDirectories();
function fetchDirectories(){
userService.fetchDirectories()
.then(function(response) {
$scope.directoryList = response;
$scope.lastView = $ionicHistory.backView() ;
if($scope.lastView !=null){
if($scope.lastView.stateName != 'app.home'){
var indexNumber = sessionStorage.getItem("indexNumber");
$scope.changeSlide(indexNumber,$scope.directoryList);
}
}else{
$scope.changeSlide(0,$scope.directoryList);
}
window.dispatchEvent(new Event('resize'));
},
function(errResponse){
}
);
};
$scope.changeSlide
$scope.changeSlide = function (index,directoryName)
{
console.log('Slide changed to ' + index);
if($location.path() == '/app/home'){
console.log($location.path());
var data= directoryName[index]
if(data !=null){
var directoryId =data.directoryId;
data.dirId = directoryId;
getImages();
function getImages() {
userService.getImages(data).then(function(response) {
$scope.imageData = response;
$scope.current = index;
$ionicSlideBoxDelegate.slide(index);
},function(error) {
})
}
}
$scope.ready.push(index + ': ' + true);
}
else if($location.path() != '/app/home'){
sessionStorage.setItem("indexNumber",index);
$state.go('app.home');
}
}