AngularJS error: TypeError: v2.login is not a function

In AngularJS call the function from view it must be in the $scope.

JS

// exposes login function in scope
$scope.login = login;

HTML

<div class="container" ng-controller="AuthCtrl" style="max-width: 300px"> <!-- I notice here for include ng-controller to your main div -->
<form class="form-signin">       
  <h2 class="form-signin-heading" style="text-align: center">Please Sign In</h2>
  <input type="text" class="form-control" name="username" ng-model = "username" placeholder="Email Address" required="" autofocus="" />
    </br>
  <input type="password" class="form-control" name="password" ng-model = "password" placeholder="Password" required=""/>
    </br>
  <button class="btn btn-lg btn-primary btn-block" type="submit" ng-click="login()">Login</button>   
</form>


In my case, I was having an exact same issue as yours. However, coming across gkalpak's answer to such a scenario helped me out.

Turned out to be what I was calling was addBuddy() function, from a form named "addBuddy". The solution was to change the name of either of the two things to make one stand out or differentiable from the other. I changed the name of the form to "addBuddyForm" and voila! My function worked!

Here's a snippet of my case:

<form name="addBuddy" class="form-horizontal" novalidate>
...
<button class="btn btn-sm btn-info" ng-click="addBuddy()>Submit</button>

Which, I changed to:

<form name="addBuddyForm" class="form-horizontal" novalidate>
...
<button class="btn btn-sm btn-info" ng-click="addBuddy()>Submit</button>

...and it worked! :)


Edge case here, but I want to mention it for posterities' sake. I got this same error when using the controllerAs pattern with a form name with the same value as ng-submit. For example:

<form name="authCtrl.signUp" ng-submit="authCtrl.signUp()">

Throws: TypeError: v2.signUp is not a function

The solution was to change the name of the form to something different:

<form name="authCtrl.signUpForm" ng-submit="authCtrl.signUp()">