【问题标题】：AngularJS doesn't play nice with [ ] in form field nameAngularJS 在表单字段名称中不能很好地使用 [ ]
【发布时间】：2015-06-10 09:56:22
【问题描述】：

我正在使用 AngularJS 在 Symfony2 表单中进行验证。表单字段的名称由 Symfony2 给出，在本例中为“license[domain]”，并且验证工作非常出色，但 AngularJS 看起来与名称中的大括号不匹配。

树枝：

<div class="col-md-12 has-feedback" ng-class="{
    'has-error': !license.{{ form.domain.vars.full_name }}.$valid,
    'has-success': license.{{ form.domain.vars.full_name }}.$valid
     }">   
     {{ form_widget(form.domain, {
         'attr': {
                 'ng-model': "licenseDomain",
                 'class': "form-control",
                 'ng-pattern': "/^[0-9a-z-]+$/"
                  }
         }) }}
     <span class="glyphicon form-control-feedback" aria-hidden="true" ng-class="{'glyphicon-ok': licenseForm.{{ form.domain.vars.full_name}}.$valid,
'glyphicon-remove': !licenseForm.{{ form.domain.vars.full_name }}.$valid }"></span>

{% verbatim %}
<tt>{{ license }}</tt><br/><br/>
<tt>license.{% endverbatim %}{{ form.domain.vars.full_name }}{% verbatim %}.$valid = {{license.{% endverbatim %}{{ form.domain.vars.full_name }}{% verbatim %}.$valid }}</tt><br/>
<tt>{% endverbatim %}{{ form.domain.vars.full_name }}{% verbatim %}.$valid = {{{% endverbatim %}{{ form.domain.vars.full_name }}{% verbatim %}.$valid }}</tt><br/>
<tt>license.domain.$valid = {{license.domain.$valid }}</tt><br/>
<tt>license.licenseDomain.$valid = {{license.licenseDomain.$valid }}</tt><br/>
<tt>license.$valid = {{license.$valid}}</tt><br/>
{% endverbatim %}
</div>

渲染的 TT 部分

<tt class="ng-binding">
    {"$error":{"required":[{"$validators":{},"$asyncValidators":{},"$parsers":[],"$formatters":[null],"$viewChangeListeners":[],"$untouched":true,"$touched":false,"$pristine":true,"$dirty":false,"$valid":false,"$invalid":true,"$error":{"required":true},"$name":"license[domain]","$options":null}]},"$name":"license","$dirty":false,"$pristine":true,"$valid":false,"$invalid":true,"$submitted":false,
         "license[domain]":{"$validators":{},"$asyncValidators":{},"$parsers":[],"$formatters":[null],"$viewChangeListeners":[],"$untouched":true,"$touched":false,"$pristine":true,"$dirty":false,"$valid":false,"$invalid":true,"$error":{"required":true},"$name":"license[domain]","$options":null}}
</tt><br><br>    
<tt class="ng-binding">license.license[domain].$valid = </tt><br>
<tt class="ng-binding">license[domain].$valid = </tt><br><tt class="ng-binding">license.domain.$valid = </tt><br>
<tt class="ng-binding">license.licenseDomain.$valid = </tt><br>
<tt class="ng-binding">license.$valid = false</tt><br></div>

验证工作完美，但对字段的引用却不行。如您所见，最后一个 TT 将 license.$valid 呈现为 false，而第一个（许可证转储）显示一个“license [domain]”对象，但我尝试在两者之间引用它的任何方法都不起作用。

有什么想法吗？

【问题讨论】：

标签： angularjs forms validation

【解决方案1】：

我终于设法用 [] 而不是 . 来引用它并引用它。

呼……

树枝：

<tt>license["{% endverbatim %}{{ form.domain.vars.full_name }}{% verbatim %}"].$valid = {{license["{% endverbatim %}{{ form.domain.vars.full_name |e }}{% verbatim %}"].$valid }}</tt><br/>

渲染的 TT：

<tt class="ng-binding">license["license[domain]"].$valid = true</tt>

虽然看起来很丑... :(

【讨论】：