Question

我的设置：

$ ionic info

Your system information:

Cordova CLI: 6.2.0
Gulp version:  CLI version 3.9.1
Gulp local:  
Ionic CLI Version: 2.0.0
Ionic App Lib Version: 2.0.0-beta.20
OS: Distributor ID: LinuxMint Description:  Linux Mint 17.1 Rebecca 
Node Version: v0.12.2

我正在为Android构建基于Ionic的移动应用程序。这个应用程序有侧面菜单和标签栏组件。我希望他们打开sidemenu作为启动应用程序时加载的默认视图。下面是我的routes.js文件。我用$ urlRouterProvider.otherwise（）修改并尝试了各种各样的东西，但我无法通过侧面菜单打开它。请协助。感谢

routes.js

angular.module('app.routes', [])

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

  // Ionic uses AngularUI Router which uses the concept of states
  // Learn more here: https://github.com/angular-ui/ui-router
  // Set up the various states which the app can be in.
  // Each state's controller can be found in controllers.js
  $stateProvider



      .state('menu.latestICDLNews', {
    url: '/news',
    views: {
      'side-menu21': {
        templateUrl: 'templates/latestICDLNews.html',
        controller: 'latestICDLNewsCtrl'
      }
    }
  })

  .state('menu.iCDLModules', {
    url: '/modules',
    views: {
      'side-menu21': {
        templateUrl: 'templates/iCDLModules.html',
        controller: 'iCDLModulesCtrl'
      }
    }
  })

  .state('menu.trainingExams', {
    url: '/training',
    views: {
      'side-menu21': {
        templateUrl: 'templates/trainingExams.html',
        controller: 'trainingExamsCtrl'
      }
    }
  })

  .state('menu', {
    url: '/side-menu',
    templateUrl: 'templates/menu.html',
    abstract:true
  })

  .state('menu.accreditedICDLCenters', {
    url: '/centers',
    views: {
      'side-menu21': {
        templateUrl: 'templates/accreditedICDLCenters.html',
        controller: 'accreditedICDLCentersCtrl'
      }
    }
  })

  .state('menu.becomeACenter', {
    url: '/becomecenter',
    views: {
      'side-menu21': {
        templateUrl: 'templates/becomeACenter.html',
        controller: 'becomeACenterCtrl'
      }
    }
  })

  .state('menu.fAQS', {
    url: '/faq',
    views: {
      'side-menu21': {
        templateUrl: 'templates/fAQS.html',
        controller: 'fAQSCtrl'
      }
    }
  })

  .state('menu.credits', {
    url: '/credits',
    views: {
      'side-menu21': {
        templateUrl: 'templates/credits.html',
        controller: 'creditsCtrl'
      }
    }
  })

  .state('menu.introductoryModules', {
    url: '/introductory-modules',
    views: {
      'side-menu21': {
        templateUrl: 'templates/introductoryModules.html',
        controller: 'introductoryModulesCtrl'
      }
    }
  })

  .state('menu.baseModules', {
    url: '/base-modules',
    views: {
      'side-menu21': {
        templateUrl: 'templates/baseModules.html',
        controller: 'baseModulesCtrl'
      }
    }
  })

  .state('menu.standardModules', {
    url: '/standard-modules',
    views: {
      'side-menu21': {
        templateUrl: 'templates/standardModules.html',
        controller: 'standardModulesCtrl'
      }
    }
  })

  .state('menu.advancedModules', {
    url: '/advanced-modules',
    views: {
      'side-menu21': {
        templateUrl: 'templates/advancedModules.html',
        controller: 'advancedModulesCtrl'
      }
    }
  })

  .state('menu.contactUs', {
    url: '/contactus',
    views: {
      'side-menu21': {
        templateUrl: 'templates/contactUs.html',
        controller: 'creditsCtrl'
      }
    }
  })

$urlRouterProvider.otherwise('/side-menu/modules')

});

第二个应用

routes.js：

angular.module('app.routes', [])

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

  // Ionic uses AngularUI Router which uses the concept of states
  // Learn more here: https://github.com/angular-ui/ui-router
  // Set up the various states which the app can be in.
  // Each state's controller can be found in controllers.js
  $stateProvider



      .state('menu.latestICDLNews', {
    url: '/news',
    views: {
      'side-menu21': {
        templateUrl: 'templates/latestICDLNews.html',
        controller: 'latestICDLNewsCtrl'
      }
    }
  })

  .state('menu.iCDLModules', {
    url: '/modules',
    views: {
      'side-menu21': {
        templateUrl: 'templates/iCDLModules.html',
        controller: 'iCDLModulesCtrl'
      }
    }
  })

  .state('menu.trainingExams', {
    url: '/training',
    views: {
      'side-menu21': {
        templateUrl: 'templates/trainingExams.html',
        controller: 'trainingExamsCtrl'
      }
    }
  })

  .state('menu', {
    url: '/side-menu',
    templateUrl: 'templates/menu.html',
    abstract:true
  })

  .state('menu.accreditedICDLCenters', {
    url: '/centers',
    views: {
      'side-menu21': {
        templateUrl: 'templates/accreditedICDLCenters.html',
        controller: 'accreditedICDLCentersCtrl'
      }
    }
  })

  .state('menu.becomeACenter', {
    url: '/becomecenter',
    views: {
      'side-menu21': {
        templateUrl: 'templates/becomeACenter.html',
        controller: 'becomeACenterCtrl'
      }
    }
  })

  .state('menu.fAQS', {
    url: '/faq',
    views: {
      'side-menu21': {
        templateUrl: 'templates/fAQS.html',
        controller: 'fAQSCtrl'
      }
    }
  })

  .state('menu.credits', {
    url: '/credits',
    views: {
      'side-menu21': {
        templateUrl: 'templates/credits.html',
        controller: 'creditsCtrl'
      }
    }
  })

  .state('menu.introductoryModules', {
    url: '/introductory-modules',
    views: {
      'side-menu21': {
        templateUrl: 'templates/introductoryModules.html',
        controller: 'introductoryModulesCtrl'
      }
    }
  })

  .state('menu.baseModules', {
    url: '/base-modules',
    views: {
      'side-menu21': {
        templateUrl: 'templates/baseModules.html',
        controller: 'baseModulesCtrl'
      }
    }
  })

  .state('menu.standardModules', {
    url: '/standard-modules',
    views: {
      'side-menu21': {
        templateUrl: 'templates/standardModules.html',
        controller: 'standardModulesCtrl'
      }
    }
  })

  .state('menu.advancedModules', {
    url: '/advanced-modules',
    views: {
      'side-menu21': {
        templateUrl: 'templates/advancedModules.html',
        controller: 'advancedModulesCtrl'
      }
    }
  })

  .state('menu.contactUs', {
    url: '/contactus',
    views: {
      'side-menu21': {
        templateUrl: 'templates/contactUs.html',
        controller: 'creditsCtrl'
      }
    }
  })

$urlRouterProvider.otherwise('/side-menu/modules')



});

menu.html：

<ion-side-menus enable-menu-with-back-views="false">
    <ion-side-menu-content>
        <ion-nav-bar class="bar-calm">
            <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="side-menu21"></ion-nav-view>
    </ion-side-menu-content>
    <ion-side-menu side="left" id="side-menu21">
        <ion-header-bar class="bar-calm">
            <div class="title">Menu</div>
        </ion-header-bar>
        <ion-content padding="false" class="side-menu-left has-header">
            <div class="">
                <img src="img/icdl.png" width="100%" height="auto" style="display: block; margin-left: auto; margin-right: auto;">
            </div>
            <ion-list id="menu-list3" class=" ">
                <ion-item class="calm  " id="menu-list-item1" ui-sref="menu.latestICDLNews" menu-close="">Latest ICDL News</ion-item>
                <ion-item class="calm  " id="menu-list-item2" ui-sref="menu.iCDLModules" menu-close="">ICDL Modules</ion-item>
                <ion-item class="calm  " id="menu-list-item3" ui-sref="menu.trainingExams" menu-close="">ICDL Training &amp; Exams</ion-item>
                <ion-item class="calm  " id="menu-list-item4" href="#" onclick="window.open('http://www.icdlprofilezw.org/', '_system', 'location=yes'); return false;">ICDL Online Profile</ion-item>
                <ion-item class="calm  " id="menu-list-item5" href="#" onclick="window.open('http://icdlafrica.org/find-a-test-centre', '_system', 'location=yes'); return false;" >Accredited ICDL Centers</ion-item> <!-- ui-sref="menu.accreditedICDLCenters" menu-close="" -->
                <ion-item class="calm  " id="menu-list-item6" ui-sref="menu.becomeACenter" menu-close="">Become an ICDL Center</ion-item>
                <ion-item class="calm  " id="menu-list-item8" ui-sref="menu.fAQS" menu-close="">FAQ's</ion-item>
                <ion-item class="calm  " id="menu-list-item10" href="/contactus" ui-sref="menu.contactUs" menu-close="">Contact Us</ion-item>
                <ion-item class="calm  " id="menu-list-item9" ui-sref="menu.credits" menu-close="">Credits</ion-item>
            </ion-list>
        </ion-content>
    </ion-side-menu>
</ion-side-menus>

Answer 1

你可以定义

$ionicSideMenuDelegate.toggleLeft();

或

$ionicSideMenuDelegate.toggleRight();

你app.run方法中的

。或者您可以在抽象状态下定义控制器并在该控制器中编写上述代码

如何将我的（打开）侧面菜单设置为Ionic移动应用程序中的默认视图

1 个答案: