title: AngularJS Login form with ng-click not working
body: <p>I wrote a basic login form in this plunk <a href="http://plnkr.co/edit/xQEN1ZNN5ZEw1CSwNw97?p=preview" rel="nofollow">http://plnkr.co/edit/xQEN1ZNN5ZEw1CSwNw97?p=preview</a> (click on the red Log into Dashboard button on the Home route).</p>
  
  <p>However for some reason I cannot get the login() method to fire in my loginCtrl controller code.</p>
  
  <p>Why is this example working, and mine is not ? <a href="http://plnkr.co/edit/H4SVl6?p=preview" rel="nofollow">http://plnkr.co/edit/H4SVl6?p=preview</a></p>
  
  <p>Instead what it's doing is an old-school URL redirect with the user/password parameters passed in as form variables. I can't figure out what's wrong.</p>
  
  <p>Here is <code>LoginCtrl</code> code as well as the <code>login-form.html</code> template :</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>(function () {
      'use strict';
  
      angular.module('routerApp').controller('LoginCtrl',
          ['$rootScope', '$scope', authenticate]);
  
      function authenticate($rootScope, $scope,   userService) {
  
          var login = this;
  
          login.loginUser = function () {
              login.dataLoading = true;
              //loginService.authUser(login.user, login.password);  // TO DO !!!
          };
          login.test = function () {
              var test = true;
          };
      }
  })();</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div ng-show="error" class="alert alert-danger"&gt;{{error}}&lt;/div&gt;
  &lt;form  ng-submit="login.loginUser()" name="form"&gt;
      &lt;div class="form-group"&gt;
          &lt;label for="username"&gt;Username&lt;/label&gt;
          &lt;i class="fa fa-key"&gt;&lt;/i&gt;
          &lt;input type="text" name="username" id="username" class="form-control" ng-model="login.username" required /&gt;
          &lt;span ng-show="form.username.$dirty &amp;&amp; form.username.$error.required" class="help-block"&gt;Username is required&lt;/span&gt;
      &lt;/div&gt;
      &lt;div class="form-group"&gt;
          &lt;label for="password"&gt;Password&lt;/label&gt;
          &lt;i class="fa fa-lock"&gt;&lt;/i&gt;
          &lt;input type="password" name="password" id="password" class="form-control" ng-model="login.password" required /&gt;
          &lt;span ng-show="form.password.$dirty &amp;&amp; form.password.$error.required" class="help-block"&gt;Password is required&lt;/span&gt;
      &lt;/div&gt;
      &lt;div class="form-actions"&gt;
          &lt;button type="submit" ng-disabled="form.$invalid || dataLoading" class="btn btn-danger"&gt;Login&lt;/button&gt;
          &lt;img ng-if="login.dataLoading" src="data:image/gif;base64,R0lGODlhEAAQAPIAAP///wAAAMLCwkJCQgAAAGJiYoKCgpKSkiH/C05FVFNDQVBFMi4wAwEAAAAh/hpDcmVhdGVkIHdpdGggYWpheGxvYWQuaW5mbwAh+QQJCgAAACwAAAAAEAAQAAADMwi63P4wyklrE2MIOggZnAdOmGYJRbExwroUmcG2LmDEwnHQLVsYOd2mBzkYDAdKa+dIAAAh+QQJCgAAACwAAAAAEAAQAAADNAi63P5OjCEgG4QMu7DmikRxQlFUYDEZIGBMRVsaqHwctXXf7WEYB4Ag1xjihkMZsiUkKhIAIfkECQoAAAAsAAAAABAAEAAAAzYIujIjK8pByJDMlFYvBoVjHA70GU7xSUJhmKtwHPAKzLO9HMaoKwJZ7Rf8AYPDDzKpZBqfvwQAIfkECQoAAAAsAAAAABAAEAAAAzMIumIlK8oyhpHsnFZfhYumCYUhDAQxRIdhHBGqRoKw0R8DYlJd8z0fMDgsGo/IpHI5TAAAIfkECQoAAAAsAAAAABAAEAAAAzIIunInK0rnZBTwGPNMgQwmdsNgXGJUlIWEuR5oWUIpz8pAEAMe6TwfwyYsGo/IpFKSAAAh+QQJCgAAACwAAAAAEAAQAAADMwi6IMKQORfjdOe82p4wGccc4CEuQradylesojEMBgsUc2G7sDX3lQGBMLAJibufbSlKAAAh+QQJCgAAACwAAAAAEAAQAAADMgi63P7wCRHZnFVdmgHu2nFwlWCI3WGc3TSWhUFGxTAUkGCbtgENBMJAEJsxgMLWzpEAACH5BAkKAAAALAAAAAAQABAAAAMyCLrc/jDKSatlQtScKdceCAjDII7HcQ4EMTCpyrCuUBjCYRgHVtqlAiB1YhiCnlsRkAAAOwAAAAAAAAAAAA=="/&gt;
      &lt;/div&gt;
  &lt;/form&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>In my local app, it is posting the old-style form variables via the URL, and I cannot get it to fire the <code>login.loginUser</code> function below inside <code>LoginCtrl</code>.</p>
  
  <p>thnk you in advance...</p>
  
  <p>Bob</p>