AngularJS在获取HTML元素的控制器中引用表单

Question

I have a form named "loginForm" that has a controller "loginController" which has the method "login" set as the submit for the form. Inside of the login method in the javascript if I reference the form without referencing it with scope ; so doing "loginForm" instead of "$scope.loginForm"; I am getting a reference to the html element and if I check the window.loginForm I am finding that this is a global variable. I'm trying to figure out how this variable is getting created and placed into the global scope. Please the plnkr link below for an example of what I am referring to.

http://plnkr.co/YY3ls7ele8uNpnhstG3X

Controller

(function(){
  angular.module('testApp',[])
    .controller('loginController',['$scope',function($scope){

      $scope.login = function(){
        console.debug(loginForm); //console shows html element
        console.debug(window.loginForm); //shows html element
      }  
    }]);
  })();

Answer 1

If you are using form then you would need to pass it in fromthe view.

<form name="loginForm"  class="form-horizontal" ng-submit="login(loginForm)">

and get it in your method:-

$scope.login = function(loginForm){

Or use ng-form="formName" to get the form controller instance as a part of the scope, but there is an issue with 1.2 version of angular where ng-submit does not get trigerred on ng-form.