我有一个带有侧边菜单的离子应用程序。我的要求是在侧面菜单页面之前有一个登录页面。 通过单击登录按钮第一次应用程序重新加载,在第二次单击时导航到侧面菜单页面。 这是我的代码
app.ts
config(function ($stateProvider, $urlRouterProvider) {
$stateProvider
.state('login', {
url: '/login',
templateUrl: 'templates/login.html',
controller: 'loginCtrl'
})
.state('app', {
url: '/app',
abstract: true,
templateUrl: 'templates/menu.html',
controller: 'AppCtrl'
})
.state('app.home', {
url: '/home',
cache: true,
views: {
'menuContent': {
templateUrl: 'templates/home.html',
controller: "homeController"
}
}
})
<ion-view>
<ion-content>
<div class="login-main-heading">
<h3 class="all-elements-center login-heading">Welcome</h3>
<div class="form-elements responsive-sm">
<h5 class="all-elements-center login-heading">Login</h5>
<form action="">
<div class="list list-inset">
<label class="item item-input">
<i class="icon ion-person placeholder-icon"></i>
<input type="text" placeholder="User Name">
</label>
<label class="item item-input">
<i class="icon ion-lock-combination placeholder-icon"></i>
<input type="password" placeholder="Password">
</label>
<div class="responsive-sm">
<button class="button button-large button-assertive button-login">
Login
</button>
<button class="button button-large button-assertive button-signup">
Sign Up
</button>
</div>
<div>
<button class="button button-block button-positive button-facebook- login" ng-click="login()">
Login
</button>
</div>
</div>
</form>
</div>
</ion-content>
</ion-view>
登录-controller.js
angular.module('starter')
.controller('loginCtrl', function ($scope, $state,$ionicSideMenuDelegate) {
$scope.login = function () {
$state.go('app.home');
}
});
应用-controller.js
angular.module('starter.controllers', [])
.controller('AppCtrl', function ($scope, $state) {
});