How to check login credentials and go to home screen after login page

i’m having difficulty with my code to set login credentials and to move on to next page and display next page.

HTML CODE

  <form method="post" >
    <div id="form-wrapper"  ng-controller="LoginCtrl">                     

      
        <label class="item item-input item-floating-label">
         <h2 class="light">
           Enter Username</h2> <input  type="text" id="username" ng-model="username" placeholder="Username">
        </label>
  
        <label class="item item-input item-floating-label">
         <h2 class="light">    
          Enter Password</h2> <input type="Password" id="password" ng-model="password" placeholder="*********">
        </label>
        <button class="button button-block button-positive" ng-click="login()">
           login
        </button>
    </div>
  </form>      

JS CODE

STATES

angular.module(‘starter’, [‘ionic’])
.config(function($stateProvider, $urlRouterProvider) {
$stateProvider
.state(‘home’, {
url: ‘/home’,
templateUrl: ‘page2.html’,
controller: ‘HomeCtrl’
})
.state(‘login’, {
url: ‘/login’,
templateUrl: ‘lndex.html’,
controller: ‘LoginCtrl’
})

    $urlRouterProvider.otherwise('/login');
});

HOME PAGE CONTROLLER

angular.module(‘starter’, [‘ionic’])
.controller(‘HomeCtrl’, function() {
this.photos = [
‘img/weq.gif’,
‘img/a.gif’,
‘img/b.gif’,
‘img/c.gif’,
‘img/d.gif’,
‘img/qw.gif’,
];
});

LOGIN PAGE CONTROLLER

angular.module(‘starter’, [‘ionic’])
.controller(‘LoginCtrl’, function($scope, LoginService, $ionicPopup, $state) {

$scope.data = {

};

$scope.login = function() {
console.log("LOGIN user: " + $scope.data.username + " - PW: " + $scope.data.password);

LoginService.loginUser($scope.data.username, $scope.data.password).success(function(data) {
  console.log("Login Successful");
    $state.go('home');
}).error(function(data) {
    var alertPopup = $ionicPopup.alert({
        title: 'Login failed!',
         template: 'Please check your credentials!'
   });
 });

}

});

Hi, @azhar11114

You have used ng-model="username" and ng-mode="password" in this code, but you have write a code in controller something like, ($scope.data.username, $scope.data.password) and its not correct. Instead use below mentioned code.

LoginService.loginUser ($scope.username, $scope.password).success(function(data) { 
       ....................................
})

Hope this will solve your issue.

Feel free to mark it as a solution and you can always like the answer by clicking heart icon.

i’m still having same error messages. this is my code after some changes.

Login Controller

angular.module(‘starter’, [‘ionic’])
.controller(‘LoginCtrl’, function($scope, LoginService, $ionicPopup, $state) {

  $scope.data = {


  };

  var login = function() {
    console.log("LOGIN user: " + $scope.username + " - PW: " + $scope.password);

    LoginService.loginUser($scope.username, $scope.password).success(function(data) {
      console.log("Login Successful");
        $state.go('home');
    }).error(function(data) {
        var alertPopup = $ionicPopup.alert({
            title: 'Login failed!',
            template: 'Please check your credentials!'
        });
    });
  }

});

and html code looks like this

<body ng-app="starter" >

<ion-content>
      <div id="form-wrapper"  ng-controller="LoginCtrl"> 
      
        <form novalidate ng-submit="login()" >

          
                        

          
            <label class="item item-input item-floating-label">
             <h2 class="light">
               Enter Username</h2> <input  type="text" id="username" ng-model="username" placeholder="Username">
            </label>
      
            <label class="item item-input item-floating-label">
             <h2 class="light">    
              Enter Password</h2> <input type="Password" id="password" ng-model="password" placeholder="*********">
            </label>
            <button class="button button-block button-positive" type="submit">
               login
            </button>
        </form>
        
      </div>
           
</ion-content>


   
  </body>

hey, @azhar11114
What actually your getting at your console.log and try to figure out by putting break point at this : `[quote=“azhar11114, post:1, topic:82024”]
LoginService.loginUser
[/quote]

`

i’m trying that if my username and password is there so it will give a succcess message and move toward next page.so when i’ll attach it with database in future i don;t have to rewrite the code for it i just simply take input and match it with database

show what is inside your LoginService