【问题标题】:button click event not working when side menu is open ionic打开侧边菜单时按钮单击事件不起作用离子
【发布时间】:2023-03-10 20:50:02
【问题描述】:

我创建了一个带有侧边菜单的 cordova ionic 应用程序。默认情况下,我需要保持侧面菜单打开。当我单击页面上的按钮时,它不起作用。我在页面上单击了两次。第一次单击按钮时,侧面菜单关闭,然后我必须再次单击按钮才能执行操作。即使打开了侧边菜单,我怎样才能使它工作。

SideMenu.html

    <ion-side-menus enable-menu-with-back-views="false" class="menu-page">
      <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" class="left-nav">

   <ion-content scroll="false"  has-bouncing="false">
    <div class="user-info text-center">

   </div>
     <ion-list>
          <a class="item item-icon-left" menu-close ui-sref="app.menuscreen" ui-sref-active="selected">
             <i class="ion-home"></i><span>Home</span>
         </a>
      </ion-list>
   </ion-content>
  </ion-side-menu>
</ion-side-menus>

app.js

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

             .state('app', {
               url: '/app',
               abstract: true,
              templateUrl: 'templates/sidemenu.html',
           })

            .state('app.menuscreen', {
               url: '/menuscreen',
               views: {
                   'menuContent': {
                        templateUrl: 'templates/menuscreen.html',
                  }
            }
           })

MenuScreen.html

            <ion-view> 
            <ion-content has-bouncing="false">

            <div class="button-box">
                <h2>Would you like to?</h2>
                <!--Button-->
                <div class="btn-box">
                    <div class="btn-parent-box">
                        <div class="icon">
                            <i class="ion-ios-plus-outline"></i>
                        </div>
                        <button class="button button-full btn-orange" type="submit"
                            ui-sref="newjob" title="New Job">New Job</button>
                        <div class="clearfix"></div>
                    </div>
                </div>
                <!--/button-->
            </div>
            </ion-content> 
            </ion-view>

【问题讨论】:

    标签: angularjs cordova ionic-framework


    【解决方案1】:

    根据您的菜单,而不是更好地使用菜单关闭来对用户 menu-toggle="left" / menu-toggle="right" 进行操作,您可以将该按钮事件用于某些代码。你所要做的就是,

     <button class="button button-full btn-orange" type="submit" menu-toggle="left" ui-sref="newjob" title="New Job">New Job</button>
    

    在菜单中,所谓的列表就是添加

    menu-toggle="left".
    

    就是这样。并且您可以执行所有操作。

    如果正确投票给它。

    【讨论】:

    • 感谢@Nitin Agarwal。因为我也在寻找它。
    • @Nitin 它在我的情况下不起作用...我已将 menu-close 替换为 menu-toggle="left" 但由于这个原因,当我导航时...顶部的导航图标是正在更改为后退按钮...
    • 所以你可以问你的问题。如果你不想这样,只需删除 ion-nav-back-button。而已。或者与 plunker / jsfiddle 分享你的代码
    猜你喜欢
    • 2019-02-01
    • 1970-01-01
    • 2012-08-29
    • 1970-01-01
    • 1970-01-01
    • 2019-02-11
    • 2016-01-23
    • 1970-01-01
    • 2019-06-25
    相关资源
    最近更新 更多