Ionic sidemenu problem

[Shiva Rowshan rad]

Hi every one:

I,m using ionic SideMenu but when I click on its items it just close and doesn't redirect to the desired page:

Here is my side menu code:

<ion-side-menus>

    <ion-side-menu-content>

        <ion-nav-bar class="bar-energized">

            <ion-nav-back-button ></ion-nav-back-button>

            

            <ion-nav-buttons side="left">

                <button menu-toggle="left" class="button button-icon icon ion-navicon"></button>

            </ion-nav-buttons>

        </ion-nav-bar>

        <ion-nav-view animation="slide-left-right"></ion-nav-view>

    </ion-side-menu-content>

    <ion-side-menu side="left">

        <header class="bar bar-header bar-energized">

            <h1 class="title">Menu</h1>

        </header>

        <ion-content class="has-header">

            <ion-list>

                <ion-item nav-clear menu-close href="#/app/home">

                    Home

                </ion-item>

                <ion-item nav-clear menu-close  href="#/intro">

                    Introduction

                </ion-item>

            </ion-list>

        </ion-content>

    </ion-side-menu>

</ion-side-menus>

and here is my states definition: 

 .config(function ($stateProvider, $urlRouterProvider) {

            $stateProvider

                .state("intro", {

                    url: "/intro",

                    templateUrl: "app/templates/Intro.html",

                    controller: "introCtrl"

                })

            .state("app", {

                url: "/app",

                abstract: true,

                templateUrl: "app/templates/view-menu.html",

                controller: "appCtrl"

            })

                .state("app.home", {

                    url: "/home",

                    templateUrl: "app/templates/view-home.html",

                    controller: "homeCtrl"

                })

                .state("app.Games", {

                    url: "/Games",

                    templateUrl: "app/templates/GamesIntro.html",

                    controller: "GamesCtrl"

                })

                .state("app.Details", {

                    url: "/Details",

                    templateUrl: "app/templates/Details.html",

                    controller: "detailCtrl"

                }).state("app.Details.game", {

                    url: '/GameTab',

                    views: {

                        'game-tab':

                            {

                                templateUrl: 'app/templates/GameTab.html',

                                controller: 'GameTabCtrl'

                            }

                    }

                }).state("app.Details.cmnt", {

                    url: '/cmntTab',

                    views: {

                        'cmnt-tab':

                            {

                                templateUrl: 'app/templates/cmntTab.html',

                                controller: 'cmntTabCtrl'

                            }

                    }

                });

            $urlRouterProvider.otherwise("app/home");

        })

What should I to make it work?? thanks in advance

[Rob Willett]

I am not my computer at the moment, but I would change your

href="#/intro"

to a ng-click="GotoIntroPage()" or something and do a $state.go("intro") in GotoIntroPage()

This is wholly untested and just a guess but I recall that href in ionic isn't that reliable. We use $state.go for all changes like this.

Rob. 

--
-- You received this message because you are subscribed to the Google
Groups "phonegap" group.
To post to this group, send email to phon...@googlegroups.com
To unsubscribe from this group, send email to
phonegap+u...@googlegroups.com
For more options, visit this group at
http://groups.google.com/group/phonegap?hl=en?hl=en
 
For more info on PhoneGap or to download the code go to www.phonegap.com
---
You received this message because you are subscribed to the Google Groups "phonegap" group.
To unsubscribe from this group and stop receiving emails from it, send an email to phonegap+u...@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

[Shiva Rowshan rad]

Thanks I did what you said but its only works for home state and it does not work for intro state; although I can change state to intro from other states with $scope.go('intro') . but it does not work for menu  ng-click method :(

[Shiva Rowshan rad]

When I change the state to app.intro in state definition it works but I dont want that page to have the template of other pages. please help me!

[Rob Willett]

Still not near computer. Try putting the state.go in a timeout. I'm reasonably certain I use state.go in an ng-click.

I have to program this in the next few days but can't get to computer until Monday.

Rob

[Rob Willett]

I've got back to the office earlier than expected and we've just coded
up a revised help system.

1. We have a button in a menu bar (it's actually an icon).
2. The button has an ng-click that calls a function ShowHelp() in
Navigation Controller.
3. The function ShowHelp() calls $state.go('help') which calls a
series of Help screens defined as ion-slides.

We didn't use any timeouts at all and simply coded it up as I've
already outlined.

Here's the ShowHelp function

$scope.ShowHelp = function () {
// ConsoleLog("$scope.ShowHelp called");

$state.go('help');
};

Here's the icon/button in index.html

<ion-nav-buttons side="right">
<button class="button button-clear button-custom"
ng-click="ShowHelp()" ng-show="ShouldHelpOptionBeEnabled()">
<i class="icon jambuster-help"></i>
</button>
<button class="button button-icon button-clear
ion-navicon" ng-click="ShowRightMenu()"
ng-show="ShouldRightSideMenuBeEnabled()">
</button>
</ion-nav-buttons>

and heres the app.js where we define the help templates.

$stateProvider

// The help controller is for normal help
.state('help', {
url: '/help',
templateUrl: 'templates/help.html',
controller: 'HelpCtrl'
})

So it does work as we thought. You have something else wrong.

Rob