无法读取uib-tabset中的表单。

Question

我正在尝试从我的控制器读取表单。但我的错误还不明确。这是我的代码样本。

HTML -

<uib-tabset name="tabMain" id="tabMain1">
<uib-tab heading="SomeTabName" name="tab1" id="tab1X">
    <form name="formId" class="form-horizontal" novalidate autocomplete="off"></form>
</uib-tab>
</uib-tabset>

控制员-

$scope.formId.$setPristine();

问题是$scope无法读取formId。它的意思还不明确。

请有人帮我。

谢谢Gulrej

Answer 1

在控制器中，在顶部附近添加这条线：

$scope.forms = {};

然后，在<form>元素中，将名称更改为<form name="forms.formId"...

现在，在您试图访问$scope.formId并获取未定义错误的代码中，将代码更改为$scope.forms.formId，它应该可以工作。

我找到了回答这里。

Answer 2

表单只在控制器最初运行后向控制器的$scope注册。因此，即使所有设置都正确，$scope也将返回未定义的内容。

在要对theForm的存在作出反应的示例中，可以在theForm上设置一个监视程序，根据其存在设置调试文本：

$scope.$watch('theForm', function(theForm) {
    if(theForm) { 
        $scope.formDebugText = 'Form in Scope';
    }
    else {
        $scope.formDebugText = 'Form is Undefined';
    }        
});

Answer 3

我面临着同样的问题，外部形式的输入分布在uib-选项卡之间。

在深入研究安古拉杰博士之后，您需要在uib-tabset之外公开一个表单。

<form name="outerForm" class="tab-form-demo">
  <uib-tabset active="activeForm">
    <uib-tab index="0" heading="Form Tab">
      <form name="nestedForm">
        <div class="form-group">
          <label>Name</label>
          <input type="text" class="form-control" required ng-model="model.name"/>
        </div>
      </form>
    </uib-tab>
  </uib-tabset>
</form>

<pre>{{ outerForm.nestedForm | json }}</pre>

或者简单地添加一个包装uib-tabset的表单。

<form name="outerForm" class="tab-form-demo">
  <uib-tabset active="activeForm">
    <uib-tab index="0" heading="Form Tab">
        <div class="form-group">
          <label>Name</label>
          <input type="text" class="form-control" required ng-model="model.name"/>
        </div>
    </uib-tab>
  </uib-tabset>
</form>