【问题标题】:Ionic left sidemenu does not toggle open离子左侧菜单无法打开
【发布时间】:2015-11-16 07:16:07
【问题描述】:

您好,我对 ionic 比较陌生,我正在尝试让一个应用程序同时运行一个侧面菜单和一个标签栏。目前,标签栏工作正常,只是当我单击图标时左侧菜单未打开。对于大多数应用程序,我一直在学习 ionic 网站上的教程。

我正在将谷歌地图添加到标签中,我的目标是让侧边栏登录 Facebook,但主要问题是标签没有切换。

app.js

    $stateProvider

    .state('menu', {
      url: "/menu",
      abstract: true,
      templateUrl: "templates/menu.html",
      controller: 'AppCtrl'
    })

    .state('menu.playlists', {
      url: "/playlists",
      views: {
        'menu' :{
          templateUrl: "templates/playlists.html",
          controller: 'PlaylistsCtrl'
        }
      }
    })  

    // setup an abstract state for the tabs directive
    .state('tab', {
    url: '/tab',
    abstract: true,
    templateUrl: 'templates/tabs.html'
    })

    .state('tab.map', {
    url: '/map',
    views: {
      'tab-map': {
        templateUrl: 'templates/tab-map.html',
        controller: 'MapCtrl'
      }
    }
    })

    // if none of the above states are matched, use this as the fallback
    $urlRouterProvider.otherwise('/tab/map');

tab-map.html

<ion-view view-title="Safety First">
  <ion-nav-buttons side="left" ng-controller="AppCtrl">
    <button menu-toggle="left" class="button button-icon icon ion-navicon"></button>
  </ion-nav-buttons>
  <ion-content ng-controller="MapCtrl">
    <div id="map" data-tap-disabled="true"></div>
  </ion-content>
</ion-view>

menu.html

<ion-side-menus>

  <ion-side-menu-content>
    <ion-nav-bar class="bar-stable nav-title-slide-ios7">
      <ion-nav-back-button class="button-clear"><i class="icon ion-ios7-arrow-back"></i> Back</ion-nav-back-button>
    </ion-nav-bar>
    <ion-nav-view name="menu" animation="slide-left-right"></ion-nav-view>
  </ion-side-menu-content>

  <ion-side-menu side="left">
    <header class="bar bar-header bar-stable">
      <h1 class="title">Left</h1>
    </header>
    <ion-content class="has-header">
      <ion-list>
        <ion-item nav-clear menu-close href="#/app/about">
          About
        </ion-item>
        <ion-item nav-clear menu-close ng-click="login()">
          Login
        </ion-item>
      </ion-list>
    </ion-content>
  </ion-side-menu>

</ion-side-menus>

这是应用程序主页的图片

当我单击子菜单图标时,它不会切换子菜单。奇怪的是,如果我将应用程序导航到http://localhost:8100/#/menu/playlists,则切换很好。

关于为什么点击时什么都没有触发的任何建议?也许这是当时哪个控制器在行动的问题?

【问题讨论】:

  • 不确定是否和我的情况一样。类似的情况发生在我身上。我的侧边菜单显示,但它显示在当前页面的后面。我所做的是在页面上显示一个模式,然后从该模式中推送另一个页面。 NavController for modal 和 page 不一样。如果您需要从模态导航到页面,我建议发送页面的NavController 并通过模态类中的该对象进行管理。注意:离子 2 rc-1

标签: javascript ionic-framework ionic-view


【解决方案1】:

您必须调用正确的函数。我假设login() 位于AppCtrl 控制器内。因此,ng-click 找不到该函数,除非您告诉它它的位置。由于AppCtrl负责menu.html,所以你得这样称呼它:

ng-click="this.login()"

【讨论】:

  • 澄清一下。我的意思是当您单击侧面菜单按钮(在导航标题中)时没有任何反应,而不是当您单击登录()时。我在帖子中添加了更多细节。
猜你喜欢
  • 1970-01-01
  • 2013-01-27
  • 2020-09-13
  • 1970-01-01
  • 2016-06-26
  • 2012-08-24
  • 2016-01-07
  • 1970-01-01
  • 2016-04-08
相关资源
最近更新 更多