ionic 1 - 来自sidemenu的所选选项未在其父视图中显示

时间:2016-05-21 08:20:40

标签: angularjs ionic-framework

1)主页面是 index.html
2)默认情况下,使用路由器配置我重定向到登录页面 - template / login.html
3)从登录页面,如果登录成功,我将重定向到主页 - 侧面菜单 - template / landing.html
4)在主页上,当我点击汉堡包图标时,我得到带有选项的侧面菜单 5)但是当我点击sidemenu中的一个选项,例如“updateProfile” template / updateProfile.html 时,我无法在主页中看到相应的updateProfile页面

我尝试在配置中进行更改,但我没有取得任何进展。请帮助我。

以下是我的代码。

的index.html

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

模板/ login.html的

<ion-view view-title="Sign in">
    <ion-nav-bar class="bar-stable">
      </ion-nav-bar>
    <ion-content>
         <input type="text" placeholder="@handle" ng-model="userName" />
         <button class="button button-block button-positive" ng-click="signIn()">Sign in</button>
    </ion-content>
</ion-view>

app.js

 app.controller('LoginController',function($scope,$state){
            $state.go('landing');
        };
      });

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

    $stateProvider.state('login',{
      url : '/',
      templateUrl : 'template/login.html',
      controller : 'LoginController',
      cache : false
    });

    $stateProvider.state('landing',{
      url : '/landing',
      templateUrl : 'template/landing.html',
      controller : 'LandingController'
    }).state('landing.updateProfile', {
            url: "/updateProfile",
            views: {
                'menuContent' : {
                    templateUrl: "template/updateProfile.html"
                }
            }
        });


    $urlRouterProvider.otherwise('/');
  });

模板/ landing.html上

<ion-view view-title="Landing">
    <ion-nav-bar class="bar-stable">
    </ion-nav-bar>
    <ion-side-menus>
            <ion-side-menu-content>
                <ion-nav-bar class="bar-stable">
                    <ion-nav-buttons side="left">
                        <button menu-toggle="left" class="button button-icon button-clear ion-navicon"></button>
                    </ion-nav-buttons>
                    <ion-nav-back-button></ion-nav-back-button>
                </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"><h4>Do your thing</h4></ion-header-bar>
                <ion-content>
                    <ion-list>
                        <ion-item menu-close href="#/updateProfile">Update Profile</ion-item>
                        <ion-item menu-close href="#/yourDishes">Your Events</ion-item>
                    </ion-list>
                </ion-content>    
            </ion-side-menu>            
        </ion-side-menus>
</ion-view>

模板/ updateProfile.html

<ion-view view-title="Update Profile">
    <ion-content>
        update profile
    </ion-content>
</ion-view>

1 个答案:

答案 0 :(得分:0)

我解决了这个问题 in template / landing.html href应该是格式低于此格式,然后才会匹配配置函数中提到的相应网址。

 <ion-item menu-close href="#/landing/updateProfile">Update Profile</ion-item>
 <ion-item menu-close href="#/landing/yourDishes">Your Events</ion-item>