Hello,
I’ve been trying to add side menu to [this source code][1] but still no luck when click any contact link after searched.
Its my app.js script:
angular.module('directory', ['ionic', 'directory.controllers', 'directory.services'])
.run(function ($ionicPlatform) {
$ionicPlatform.ready(function () {
// Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
// for form inputs)
if (window.cordova && window.cordova.plugins.Keyboard) {
cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
}
if (window.StatusBar) {
// org.apache.cordova.statusbar required
StatusBar.styleDefault();
}
});
})
.config(function ($stateProvider, $urlRouterProvider) {
$stateProvider
.state('app', {
url: "/app",
abstract: true,
templateUrl: "templates/menu.html",
controller: 'AppCtrl'
})
.state('app.directory-index', {
url: '/directory',
views: {
'menuContent': {
templateUrl: 'templates/directory-list.html',
controller: 'DirectoryListCtrl'
}
}
})
.state('app.directory-detail', {
url: '/directory/:directoryId',
views: {
'menuContent': {
templateUrl: 'templates/directory-detail.html',
controller: 'DirectoryDetailCtrl'
}
}
})
.state('app.directory-reports', {
url: '/directory/:directoryId/reports',
views: {
'menuContent': {
templateUrl: 'templates/directory-reports.html',
controller: 'DirectoryReportsCtrl'
}
}
})
.state('app.about', {
url: "/about",
views: {
'menuContent': {
templateUrl: "templates/about.html"
}
}
})
$urlRouterProvider.otherwise('app/directory');
}) .controller('AppCtrl', function ($scope, $ionicModal, $timeout) {
// Form data for the login modal
$scope.loginData = {};
// Create the login modal that we will use later
$ionicModal.fromTemplateUrl('templates/login.html', {
scope: $scope
}).then(function (modal) {
$scope.modal = modal;
});
// Triggered in the login modal to close it
$scope.closeLogin = function () {
$scope.modal.hide();
},
// Open the login modal
$scope.login = function () {
$scope.modal.show();
};
// Perform the login action when the user submits the login form
$scope.doLogin = function () {
console.log('Login', $scope.loginData);
alert("Only the Facebook login is implemented in this app.");
$scope.closeLogin();
};
$scope.fbLogin = function () {
openFB.login(
function (response) {
if (response.status === 'connected') {
console.log('Facebook login succeeded');
$scope.closeLogin();
} else {
alert('Facebook login failed');
}
},
{scope: 'email,publish_actions'});
}
});
My menu.html script:
<ion-side-menus enable-menu-with-back-views="false">
<ion-side-menu-content>
<ion-nav-bar class="bar-stable">
<ion-nav-back-button>
</ion-nav-back-button>
<ion-nav-buttons side="left">
<button class="button button-icon button-clear ion-navicon" menu-toggle="left">
</button>
</ion-nav-buttons>
</ion-nav-bar>
<ion-nav-view name="menuContent"></ion-nav-view>
</ion-side-menu-content>
<ion-side-menu side="left">
<ion-header-bar class="bar-stable">
<h1 class="title">Menu</h1>
</ion-header-bar>
<ion-content>
<ion-list>
<ion-item nav-clear menu-close ng-click="login()">
Login
</ion-item>
<ion-item nav-clear menu-close href="#/app/directory">
Search
</ion-item>
<ion-item nav-clear menu-close href="#/app/about">
About
</ion-item>
</ion-list>
</ion-content>
</ion-side-menu>
</ion-side-menus>
How I can fix it?
[1]: https://github.com/ccoenraets/directory-ionic-nodejs