在 ng-repeat 中的 ng-include 中访问表单
Access form inside ng-include within ng-repeat
我想在我的应用程序中创建一个向导。我显示了导航步骤并通过单击步骤更改了 ng-include
的内容。 ng-Include
包含我想从外部访问的表单名称 stepForm
。在表单内部,我有一些动态生成的字段,我只想检查表单是否在每一步都是 $valid
。
当我 return 从内部 ng-include
形成一个函数时,它工作正常但在某些情况下我想从外部进行测试,假设我在这里有按钮来测试表单的有效性,我该如何实现。需要帮助吗?
<div ng-controller="StepController">
<div class="row">
<button type="button" class="btn btn-danger" ng-click="endCall()"><i class="fa fa-phone fa-fw"></i>End Call</button>
</div>
<div class="stepwizard">
<div class="stepwizard-row">
<div class="stepwizard-step" ng-repeat="step in view.steps">
<a href="javascript:void(0)" ng-click="goToStep($index)" type="button" class="btn btn-default btn-circle">{{step}}</a>
<p>Step {{step}}</p>
</div>
</div>
</div>
<div ng-repeat="step in view.steps">
<div ng-if="$index==getCurrentStep()">
<div ng-include="view.template">
<form name="stepForm" novalidate>
some form fields which I am validation and just want to check form is valid or not
</form>
</div>
</div>
</div>
</div>
$scope.view = {
steps: ['Step 1', 'Step 2'],
currentStepNumber: 0,
}
$scope.getCurrentStep = function () {
return $scope.view.currentStepNumber;
};
$scope.goToStep = function (index) {
if (typeof $scope.view.steps[index] != "undefined") {
$scope.view.currentStepNumber = index;
}
};
$scope.endCall=function(){ form is valid or not ?? }
ng-include
创建一个子作用域。我猜你的问题是表单验证对象在那个子范围内
建议在控制器中添加一个表单对象并将该表单对象用作 name
of <form>
$scope.wiz_form ={};
可见
<form name="wiz_form.step_1" novalidate>
当您使用 controllerAs
方法时,此类问题就会消失
我想在我的应用程序中创建一个向导。我显示了导航步骤并通过单击步骤更改了 ng-include
的内容。 ng-Include
包含我想从外部访问的表单名称 stepForm
。在表单内部,我有一些动态生成的字段,我只想检查表单是否在每一步都是 $valid
。
当我 return 从内部 ng-include
形成一个函数时,它工作正常但在某些情况下我想从外部进行测试,假设我在这里有按钮来测试表单的有效性,我该如何实现。需要帮助吗?
<div ng-controller="StepController">
<div class="row">
<button type="button" class="btn btn-danger" ng-click="endCall()"><i class="fa fa-phone fa-fw"></i>End Call</button>
</div>
<div class="stepwizard">
<div class="stepwizard-row">
<div class="stepwizard-step" ng-repeat="step in view.steps">
<a href="javascript:void(0)" ng-click="goToStep($index)" type="button" class="btn btn-default btn-circle">{{step}}</a>
<p>Step {{step}}</p>
</div>
</div>
</div>
<div ng-repeat="step in view.steps">
<div ng-if="$index==getCurrentStep()">
<div ng-include="view.template">
<form name="stepForm" novalidate>
some form fields which I am validation and just want to check form is valid or not
</form>
</div>
</div>
</div>
</div>
$scope.view = {
steps: ['Step 1', 'Step 2'],
currentStepNumber: 0,
}
$scope.getCurrentStep = function () {
return $scope.view.currentStepNumber;
};
$scope.goToStep = function (index) {
if (typeof $scope.view.steps[index] != "undefined") {
$scope.view.currentStepNumber = index;
}
};
$scope.endCall=function(){ form is valid or not ?? }
ng-include
创建一个子作用域。我猜你的问题是表单验证对象在那个子范围内
建议在控制器中添加一个表单对象并将该表单对象用作 name
of <form>
$scope.wiz_form ={};
可见
<form name="wiz_form.step_1" novalidate>
当您使用 controllerAs
方法时,此类问题就会消失