Question

我正在尝试验证自动生成的表单（通过AngularJS v1.3）输入的名称格式为：

form_name[field_name]

最基本的例子是：

<form name="morgageCalculator">
        <input type="text" class="form-control" 
            name="morgageCalculator[homeValue]" value="0"
            data-ng-model="data.homeValue" required="required"/>
</form>

如您所见，输入名称为morgageCalculator[homeValue]。现在我想在它下面添加一条错误消息：

<div class="error"
     data-ng-show="!morgageCalculator.morgageCalculator[homeValue].$pristine && morgageCalculator.morgageCalculator[homeValue].$invalid">
    Please enter a number
</div>

由于语法非常明显，此表达式无效：

morgageCalculator.morgageCalculator[homeValue].$pristine

但是这个也行不通：

morgageCalculator["morgageCalculator[homeValue]"].$pristine

那么，问题，是否有任何理智的方式来访问这些字段？我不介意将验证转移到某些控制器功能，但我遇到了无法访问字段对象的相同问题。

非常感谢任何帮助/提示。

Answer 1

在评论部分的@dfsq的帮助下，我找到了错误。与我的问题不同，我的代码遗漏了data-ng-model。

如果输入未绑定到模型，则验证将不会触发....

正确的代码段：

<form name="morgageCalculator">
    <input type="text" class="form-control" 
        name="morgageCalculator[homeValue]" value="0"
        data-ng-model="data.homeValue" required="required"/>


    <div class="error"
        data-ng-show="!morgageCalculator['morgageCalculator[homeValue]'].$pristine && morgageCalculator['morgageCalculator[homeValue]'].$invalid">
            Please enter a number
    </div>
</form>

AngularJS形成自动生成表单的验证

1 个答案: