当动态创建“inputName”时,人们将如何使用 formName.inputName.$valid ?
<form name="formName">
<input ng-repeat="(variable) in variables"
type="text" name="variable.name"
ng-model="variable.name" required />
</form>
HTML 输入属性“name”的输出将是字符串“variablename”,它将应用于所有重复的输入。
如果我们尝试这个
<form name="formName">
<input ng-repeat="(variable) in variables"
type="text" name="{{ variable.name }}"
ng-model="variable.name" required />
</form>
HTML 输入属性“name”的输出将是字符串“{{variable.name}}”,它将应用于所有重复的输入。
在这两种情况中的任何一种情况下,都不会动态创建每个重复输入元素的名称属性;所有输入将共享相同的输入名称。如果您想根据特定名称调用特定输入,则不太好。
- 需要使用动态名称值
- 需要能够调用 $scope.formName.dynamicName.$valid
- 需要能够调用 $scope.formName.$valid
- 需要将动态名称输入字段添加到嵌套表单或主表单
看起来 Angular 1.3 修复了这个问题(https://stackoverflow.com/a/32907176/3854385 https://stackoverflow.com/a/32907176/3854385)
现在 Angular 1.3+ 可以实现这一点:
<form name="vm.myForm" novalidate>
<div ng-repeat="p in vm.persons">
<input type="text" name="person_{{$index}}" ng-model="p" required>
<span ng-show="vm.myForm['person_' + $index].$invalid">Enter a name</span>
</div>
</form>
Demo http://plnkr.co/edit/mCYd64Pck3QpFiwk7rPo?p=preview
在某些情况下,如果您可以传递信息,内部表单是一个很好的解决方案:(https://stackoverflow.com/posts/12044600/ https://stackoverflow.com/posts/12044600/)
解决“动态名称”问题你需要创建一个内部表单(参见ng-form http://docs.angularjs.org/api/ng.directive:ngForm):
<div ng-repeat="social in formData.socials">
<ng-form name="urlForm">
<input type="url" name="socialUrl" ng-model="social.url">
<span class="alert error" ng-show="urlForm.socialUrl.$error.url">URL error</span>
<button ng-click="doSomething(urlForm.socialUrl.$valid)">Test</button>
</ng-form>
</div>
另一种选择是为此编写一个自定义指令。
这是 jsFiddle 显示 ngForm 的用法:http://jsfiddle.net/pkozlowski_opensource/XK2ZT/2/ http://jsfiddle.net/pkozlowski_opensource/XK2ZT/2/
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)