Javascript AngularJS-控制器中未定义的ng repeat内的表单_Javascript_Angularjs_Forms_Angularjs Ng Repeat

Javascript AngularJS-控制器中未定义的ng repeat内的表单

javascript angularjs forms

Javascript AngularJS-控制器中未定义的ng repeat内的表单,javascript,angularjs,forms,angularjs-ng-repeat,Javascript,Angularjs,Forms,Angularjs Ng Repeat,我正在尝试访问控制器中的窗体对象。表单位于ng repeat块中，它有它的动态名称，我应该能够从v1.3开始访问它 js: html: <body ng-app="app"> <div ng-controller="AppCtrl"> <div ng-repeat="form in forms" ng-init="formName = 'form' + $index"> form name should be {{formName}}

我正在尝试访问控制器中的窗体对象。表单位于ng repeat块中，它有它的动态名称，我应该能够从v1.3开始访问它

js:

html:

<body ng-app="app">
  <div ng-controller="AppCtrl">
    <div ng-repeat="form in forms" ng-init="formName = 'form' + $index">
      form name should be {{formName}}
      <form name="{{formName}}">
        <input type="text" name="field" />
      </form>
    </div>
  <button ng-click="testForm()">Check if form exists</button>
  <p ng-bind="test"></p>
  </div>
</body>


表单名称应为{{formName}}
检查表单是否存在

但在我的控制器中，$scope.form0未定义-单击“检查表单是否存在”后，我得到“表单未定义”消息。即使我给它一个静态名称（

），我仍然会一直没有定义。当我从ng repeat循环中取出表单时，它工作得很好

知道为什么没有设置吗

上面的例子是：

提前谢谢

这是因为

ng repeat

正在创建独立的子作用域，

form0

在子作用域中，并且从父作用域（控制器的作用域）看不到

因此，解决方案是将其传递给父级。但是，我们无法在ng init中执行此操作，因为此时表单控制器尚未初始化

我可以想到的一种方法是使用自定义指令将formController绑定到指定的范围

app.directive("form",function($parse){
  return{
    restrict:"E",
    priority:-1,
    link:function(scope,ele,attrs){
      var targetScope = $parse(attrs.bindToScope)(scope);
      if(targetScope){
        targetScope[attrs.name] = scope[attrs.name];
      }
    }
  }
})

通过这个，我们可以告诉表单将控制器绑定到我们指定的范围

<form name="{{formName}}" bind-to-scope='$parent' >
     <input type="text" name="field" />
</form>

<form name="{{formName}}" bind-to-scope='$parent' >
     <input type="text" name="field" />
</form>