Fatal编程技术网
  • angularjs/
  • ionic angularjs应用程序侧菜单在某些页面上禁用

ionic angularjs应用程序侧菜单在某些页面上禁用

angularjs routing ionic-framework

ionic angularjs应用程序侧菜单在某些页面上禁用,angularjs,routing,ionic-framework,angular-ui-router,Angularjs,Routing,Ionic Framework,Angular Ui Router,我正在使用Ionic和AngularJS构建一个应用程序。我有四页： 登录：不带页眉和页脚 主页：有页眉和页脚，但没有侧菜单 第1页和第2页：带有页眉、页脚和侧菜单 登录，第1页和第2页工作正常。问题在于主页。如何在主页中获得所需的功能 我试图做一个密码笔，但它不工作可能是一些设置问题 这是我的密码： index.html <html ng-app="myApp"> <head> <meta charset="utf-8"> <met

我正在使用
Ionic
和
AngularJS
构建一个应用程序。我有四页：

  • 登录：不带页眉和页脚
  • 主页：有页眉和页脚，但没有侧菜单
  • 第1页和第2页：带有页眉、页脚和侧菜单
    • 登录，第1页和第2页工作正常。问题在于主页。如何在主页中获得所需的功能

    我试图做一个密码笔，但它不工作可能是一些设置问题

    这是我的密码：

    index.html

    <html ng-app="myApp">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
    <title></title>
    <link href="lib/ionic/css/ionic.css" rel="stylesheet">
    <link href="css/style.css" rel="stylesheet">
    <script src="lib/ionic/js/ionic.bundle.js"></script>
    <script src="cordova.js"></script>
    <script src="js/angular-route.js"></script>
    <script src="js/app.js"></script>
  </head>
  <body>
    <ion-nav-view></ion-nav-view>
  </body>
</html>
    谢谢

    其实很简单，我不会为您编写所有代码，但会为您提供伪代码

    当您在状态中使用“时，您是从父级继承的。在您的例子中，您继承了menu.html，它具有导航栏和侧菜单，并且您将部分视图插入menu.html的视图名称：menucontent。这就是为什么插入menucontent的每个视图都会有
    导航栏
    和
    侧菜单

    解决方案：

    创建另一个父级，该父级将具有用于登录的页眉和页脚。通过以下操作，您可以拥有自己的家长登录。之后，您可以使用主菜单的$state.go（'app'）导航到其他页面

    $stateProvider
  .state('login', {
    url: "/login",
    templateUrl: "templates/login.html",
    controller: 'LoginCtrl'
  })
 $stateProvider
  .state('app', {
    url: "/app",
    abstract: true,
    templateUrl: "templates/menu.html",
    controller: 'AppCtrl'
  })
    至于你的家，你可以删除侧菜单。并为这两页制作侧菜单。或者使用侧菜单创建另一个父视图
    $stateProvider
    ，并将这些page1和page2视图插入到该父视图中

    如果您对如何创建父视图和插入视图感到困惑。这也很简单。在父视图中，您将有以下位置：

    <ion-nav-view name="customView"></ion-nav-view>
    这就是它的简单之处。我希望你能从中有所收获 这就是答案

    别忘了打勾：）答案如下。它起作用了：）非常感谢你的精彩解释，让我明白了它是如何工作的。你救了我一天。。。 
    $stateProvider
  .state('login', {
    url: "/login",
    templateUrl: "templates/login.html",
    controller: 'LoginCtrl'
  })
 $stateProvider
  .state('app', {
    url: "/app",
    abstract: true,
    templateUrl: "templates/menu.html",
    controller: 'AppCtrl'
  })

    <ion-nav-view name="customView"></ion-nav-view>

    $stateProvider
  .state('dashboard', {
    url: "/dashboard",
    abstract: true,
    templateUrl: "templates/Dashboard.html",
    controller: 'DashboardCtrl'
  })
 .state('dashboard.signUp',{
    url: "/signUp",
    views:{
      'customView' :{
        templateUrl: 'templates/signup.html',
        controller: 'SignupController'
      }
    }
  })