AngularJs:在ng内部形成 - 如果无法从控制器

时间:2016-11-17 07:05:45

标签: javascript angularjs

我在ng-if指令中有一个表单。我想使用$valid检查控制器中的表单验证。

    <div ng-if="paymentMethod == 12">
    <form name="creditForm" id="cc-form" novalidate>
        <div class="form-group">
            <label for="cardNumber">Card Number</label>
            <input type="text" autofocus class="form-control" name="card_number" ng-minlength="16" id="cardNumber" ng-model="creditCardNumber" required>
            <div class="red-text" ng-messages="creditForm.card_number.$error" ng-if="creditForm.card_number.$dirty || creditForm.$submitted">
                <div ng-message="required">##global.Card_Num_Required##</div>
                <div ng-message="maxlength">##global.Card_Num_MinLength##</div>
                <div ng-message="minlength">##global.Card_Num_MaxLength##</div>
                <div ng-message="minlength">##global.Card_Num_Numeric ##</div>
            </div>
        </div>

并尝试检查控制器中的有效表单

  if ($scope.$parent.creditForm.$valid) { 
      alert('valid');
      } else {
     alert('not valid');
 }

但是无法从控制器访问该表单。

4 个答案:

答案 0 :(得分:7)

ngIf指令基于{expression}删除或重新创建DOM树的一部分。如果分配给ngIf的表达式求值为false值,则从DOM中删除该元素,否则将该元素的克隆重新插入到DOM中。 你可以通过这个链接doc以及我在这里的回答answer

如果可行的话,你可以使用ng-show而不是ng-。

答案 1 :(得分:1)

$scope.$watch('creditForm.$valid', function(newVal) {
            //$scope.valid = newVal;
            alert('valid');
        });

答案 2 :(得分:1)

当您在控制器中使用辅助对象时,它工作正常。

在您的控制器文件中

def metric1_job():
    some operations
    Write data from above df
def metric2_job()
    some operations
    Write data from above df
def metric3_job()
.
.
.
def metric25_job()
    some operations
    Write data from above df

if __name__ == "__main__":
Read Df 1
Read Df 2
Read Df 3
Read Df 4
Read Df 5

Some operations on above Df.
metric1_job(df1, df2, df3, df4, df5)
metric1_job(df1, df2, df3, df4, df5)
metric1_job(df1, df2, df3, df4, df5)
.
.
.
metric25_job(df1, df2, df3, df4, df5)

在您的HTML文件中

$scope.page = {
    creditForm:null
};

在此模型中,您可以在ng-if内部安全使用ng-form

答案 3 :(得分:0)

这是因为ngIf创建了一个新的作用域,因此name =“form”将在该新作用域(它是ctrl作用域的子级)上注册表单控制器。您可以通过绑定到目标作用域上的现有对象来解决此问题。 (或者,您可以绑定到控制器并使用controllerAs语法,这通常被认为是一种很好的做法。)

这是因为原型继承在JavaScript中起作用。

你可以在这里找到一个样本plunker     <form name="data.form" novalidate ng-if=true> http://plnkr.co/edit/2Ip3gNPdUWWV0zK8PNJr?p=preview