Ionic1 app gets reload on clicking a button


#1

I have an ionic app with side-menu. My requirement is to have a Login Page before side-menu page. By clicking on login button first time application gets reload, on clicking second time navigates to the side Menu page. Here is my code

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>
login-controller.js

angular.module('starter')
.controller('loginCtrl', function ($scope, $state,$ionicSideMenuDelegate) {
$scope.login = function () {
$state.go('app.home');
}
});

app-controller.js

angular.module('starter.controllers', [])

.controller('AppCtrl', function ($scope, $state) { 
});