How to call function inside controller in angularjs

Question

I have two functions in login controller both functions are implementing login purpose , In this controller !scope.isLoggedIn condition satistified need to check if inside condition. i need to permanate login in application so i store userid and password credienticals in local sessionStorage whenever values are available in localStorage i need to execute automaticLogin function, i checked localStorage data is available or not in if condition if both userid and password is available in localStorage i need to execute automaticLoginUser function if not no need to execute automaticLogin function whenever i am try to execute that automaticLoginUser function getting error TypeError: scope.automaticLoginUser is not a function error. Thank you in advanced..!

  app.controller('LoginCtrl', ['$scope',
        'userService', '$state', '$rootScope','BackendService', 'CartService',

        function(scope, userService, $state, rootScope, BackendService, CartService) {
            scope.user = {};
            scope.isLoggedIn = false;
            scope.userId = CartService.getuserId();
            scope.userPassword = CartService.getuserPassword();
            if (!scope.isLoggedIn) {
                console.log('in side isLoggedIn');
                if (scope.userId !== undefined && scope.userPassword !== undefined) {
                    var loginId = scope.userId;
                    var password = scope.userPassword;
                    scope.user.loginId = loginId;
                    scope.user.password = password;
                    console.log('after user' + scope.user);
                    var user = scope.user;
                    scope.automaticLoginuser(user);
                }
                scope.automaticLoginuser = function(user) {
                    alert("Inside automaticLoginuser");
                    CartService.saveuserId(scope.user.loginId);
                    CartService.saveuserPassword(scope.user.password);

                    userService.loginuser(user)
                        .then(function(response) {
                            scope.userUuid = response.data.userUuid;
                            userService.setuserUuid(scope.userUuid);

                            if (response.data.status === 'success') {
                                CartService.saveFuuid(scope.fuuid);
                                $state.go("app.userHome");
                            } else {
                                $state.go("app.login");
                            }
                        });
                };

                scope.loginuser = function(user) {
                    CartService.saveuserId(scope.user.loginId);
                    CartService.saveuserPassword(scope.user.password);

                    userService.loginuser(user)
                        .then(function(response) {
                            scope.userUuid = response.data.userUuid;
                            userService.setuserUuid(scope.userUuid);

                            if (response.data.status === 'success') {
                                $state.go("app.userHome");
                            } else {
                                $state.go("app.login");

                            }
                        });
                };
            }
        ]);

I think you are calling scope.automaticLoginuser(user); before it is declared — Gerard
– Gerard, Commented Oct 11, 2017 at 10:58

Chukwuemeka Onyenezido · Accepted Answer · 2017-10-11 11:04:27Z

First I cannot overstate how ill advised it is to save a users username and password anywhere on the front end including local session storage. Hope you hashed it in some way.

Secondly, the issue you are facing is because you are trying to call scope within the controller before it is declared. This is unnecessary anyway as $scope is an instance of this which angular instantiates with the controller for you to be able to call it from the DOM.

So the correct thing will be to define the function normally since you only plan to call it in your controller.

function automaticLoginuser(user) {
    alert("Inside automaticLoginuser");
    CartService.saveuserId(scope.user.loginId);
    CartService.saveuserPassword(scope.user.password);

    userService.loginuser(user)
        .then(function(response) {
            scope.userUuid = response.data.userUuid;
            userService.setuserUuid(scope.userUuid);

            if (response.data.status === 'success') {
                CartService.saveFuuid(scope.fuuid);
                $state.go("app.userHome");
            } else {
                $state.go("app.login");
            }
        });
};

And then just call it normally

automaticLoginuser(user);

Naghaveer R · Accepted Answer · 2017-10-11 11:23:49Z

You just need to re-order your functions.

var app = angular.module("myApp", []);
app.controller('LoginCtrl', ['$scope',
  /*'userService', '$state', '$rootScope','BackendService', 'CartService',*/

  function(scope /*, userService, $state, rootScope, BackendService, CartService*/ ) {

    scope.automaticLoginuser = function(user) {
      alert("Inside automaticLoginuser");
      /*CartService.saveuserId(scope.user.loginId);
      CartService.saveuserPassword(scope.user.password);

      userService.loginuser(user)
        .then(function(response) {
          scope.userUuid = response.data.userUuid;
          userService.setuserUuid(scope.userUuid);

          if (response.data.status === 'success') {
            CartService.saveFuuid(scope.fuuid);
            $state.go("app.userHome");
          } else {
            $state.go("app.login");
          }
        });*/
    };

    scope.loginuser = function(user) {
      /*CartService.saveuserId(scope.user.loginId);
      CartService.saveuserPassword(scope.user.password);

      userService.loginuser(user)
        .then(function(response) {
          scope.userUuid = response.data.userUuid;
          userService.setuserUuid(scope.userUuid);

          if (response.data.status === 'success') {
            $state.go("app.userHome");
          } else {
            $state.go("app.login");

          }
        });*/
    };
    scope.user = {};
    scope.isLoggedIn = false;
    scope.userId = 'admin'; //CartService.getuserId();
    scope.userPassword = 'admin'; //CartService.getuserPassword();
    if (!scope.isLoggedIn) {
      console.log('in side isLoggedIn');
      if (scope.userId !== undefined && scope.userPassword !== undefined) {
        var loginId = scope.userId;
        var password = scope.userPassword;
        scope.user.loginId = loginId;
        scope.user.password = password;
        console.log('after user' + scope.user);
        var user = scope.user;
        scope.automaticLoginuser(user);
      }
    }
  }
]);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp" ng-controller="LoginCtrl">
</div>

Controllers don't really have "constructors" - they're typically used just like functions. But you can place initialization in your controller function and it will be executed initially, like a constructor:

function exampleController($scope) {
  $scope.firstMethod = function() {
    //initialize the sampleArray
  };

  $scope.secondMethod = function() {
    $scope.firstMethod();
  };

  $scope.firstMethod();
}

athms · Accepted Answer · 2017-10-11 10:58:07Z

0

scope.automaticLoginuser is being defined after your if statement. The first thing to do would be define the method higher up in the controller.

answered Oct 11, 2017 at 10:58

athms

9585 silver badges8 bronze badges

Collectives™ on Stack Overflow

How to call function inside controller in angularjs

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related