Question

如何在$ scope中按名称获取表单？测试示例：

<div ng-controller="solod">
  <form name="good_f">
   <input type="text" name="super">
  </form>
</div>



 <script> 
  function solod($scope){
    console.log($scope.good_f)//undefined 
  }

有可能吗？谢谢

Answer 1

您通常不希望控制器访问这样的表单，即将控制器与视图结构紧密耦合。相反，将表单传递给控制器，就像这样...

<div ng-controller="solod">
  <form name="good_f" ng-submit="submit(good_f)">
   <input type="text" name="super">
  </form>
</div>



 <script> 
  function solod($scope){
    $scope.submit = function(theForm){
          console.log(theForm)// not undefined 
          console.log($scope.good_f) // will exist now also
    };

    // do stuff in a watch
    $scope.$watch("good_f", function(formVal){ console.log(formVal);});
  }
  </script>

否则，如果您只是想跟踪文字输入的值，请给它ng-model

编辑：在进一步研究中，$ scope将good_f作为属性，而不是在您在构造函数中记录它时。如果你愿意，可以在good_f上设置一个监视器，但我仍然认为你应该将它传入。

name（可选）string表单的名称。如果指定，则表单   控制器将以此名称发布到相关范围。

https://docs.angularjs.org/api/ng/directive/form

Answer 2

另一种可能的方法是使用ng-form，这将有助于您轻松地通过范围访问表单。

<div ng-controller="solod">
  <ng-form name="good_f">
   <input type="text" name="super">
  </ng-form>
</div>

控制器中的脚本代码：

修改：正如JeremyWeir所提到的，为了解决您的问题，您可以使用$timeout angularjs服务

function solod($scope){ $timeout(function(){ console.log($scope.good_f); }); }

Answer 3

警告：不要使用此 - 严重

Angular不是jQuery。

与您的问题相同，您可以在控制器中使用$element（如果您对此用例的$scope用法并不具体） -

myApp.controller("myCtrl", function($scope, $element){
   alert($element.find('form').attr('name')); 
   $scope.myFormName = $element.find('form').attr('name');
});

PLNKR DEMO

如何在$ scope中按名称获取表单？

3 个答案: