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

Question

我有一个名为“ loginForm”的表单，该表单具有一个控制器“ loginController”，该控制器的方法“ login”设置为表单的提交。 如果我引用表单而不用范围引用它，则在javascript中的login方法内部； 这样做是“ loginForm”而不是“ $ scope.loginForm”； 我正在获取html元素的引用，并且如果我检查window.loginForm我发现这是一个全局变量。 我试图弄清楚如何创建此变量并将其放入全局范围。 请通过下面的plnkr链接获取我所指的示例。

http://plnkr.co/YY3ls7ele8uNpnhstG3X

控制者

(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

如果您正在使用form则需要从视图中传递它。

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

并以您的方法获取它：

$scope.login = function(loginForm){

或使用ng-form="formName"将表单控制器实例作为作用域的一部分，但是angular的1.2版本存在一个问题，即ng-submit在ng-form上不会被触发。