在AngularJS中使用包含括号的名称验证输入

Question

我有一个包含括号的名称的表单输入，例如：

<form name="my_form">  
    <input type="text" name="my_form[email]" ng-model="email" ng-class="'mycssclass': my_form.my_form[email].$invalid">
</form>

所以，问题是Angular没有应用那个css类，因为我的输入名称（my_form [email]），是在Angular中引用我的输入的正确表示法。

这是一个插件： http://plnkr.co/edit/t7PEilV9maNYGnVYnTDc?p=preview

Answer 1

引用包含括号的名称的输入的方法是使用括号表示法，如下所示：

my_form['my_form[email]'].$invalid

Answer 2

您需要在输入中使用ng-model属性。它使用$scope中的值绑定字段的内容。您还需要将Javascript对象传递给ng-class指令。在您的示例中，它将是：

<form name="my_form">  
    <input type="text" ng-model="my_form.email" ng-class="{'mycssclass': my_form.email.$invalid}">
</form>

请不要犹豫，查看ng-model和ng-class指令文档中的示例。