问题描述
限时送ChatGPT账号..我看到的答案很少适用于 ng-repeat，但使用 ng-options 我遇到了问题.
问题:如果触摸下拉菜单但未选择任何内容，想要显示所需的错误消息，我可以使用输入字段执行此操作.
JS代码
$scope.personMap = [{ name:"Abc", id:"a"},{名称:XYZ"，ID:b"}，{名称:FGH"，ID:c"}，{名称:TY"，ID:d"}}]HTML
引用此ng-repeat 解决方案
解决方案由于还没有答案，我将我发现的问题发布.
因此，当我使用 ng-options 时，它开始在下拉列表中添加一行额外的行，该行可以是空白的，或者您可以提供诸如选择我之类的内容.
我添加了以下代码来解决这个问题，在 chrome 中它不显示任何空白行.
</选择>但是当我在 IE 中尝试时它仍然有一个空行，所以当我在下拉列表中选择一个值然后点击空行时 ngMessage 工作正常.所以如果我在 chrome 中再添加一个空白选项，然后尝试先选择一些内容，然后点击空白，ngMessage 按预期工作.
问题是我期待 $touched` 状态.但它不能那样工作，我在想，如果我将焦点留在其他字段而不从下拉列表中选择任何内容，那么只要我单击下拉列表 ngMessage 就会激活.不确定我是否可以通过任何其他方式使其成为可能.
更新的 HTML
I have seen few answers which were working for ng-repeat, but with ng-options I am facing issue.
Problem : Want to show the error message required if the dropdown is touched and nothing is selected, I am able to do this with input fields.
JS CODE
$scope.personMap = [{ name:"Abc", id:"a"},
{ name:"XYZ", id:"b"},
{ name:"FGH", id:"c"},
{ name:"TY", id:"d"}
}]
HTML
<select name="inpName" ng-model="person.name" ng-options="i as i.name for i in personMap track by i.id" required>
<option value="" selected hidden/> </select>
<div ng-messages="form.inpName.$error" ng-if="form.inpName.$touched">
<div ng-message="required">Required field</div>
</div>
</div>
Referred this ng-repeat solution
解决方案As there is no answer yet, I am posting the issue i found out.
So when i use ng-options it starts adding one extra row in the dropdown which can be blank or you can give something like select me.
I added the below code to fix that and in chrome it does not show any blank row.
<option value="" selected hidden/> </select>
But when i try in IE it still have a blank row, So what happens is when I select one value in dropdown and then click back on the blank row the ngMessage works fine.So if i add one more blank option in chrome and then try to select something first and then click on blank the ngMessage work as expected.
Issue is
I was expecting <select> to work like the input fields and was trying to use the$touched` state. But it does not work like that, I was thinking as soon as i click on the dropdown ngMessage should get active if i leave the focus to other field without selecting anything from dropdown. Not sure if I can make it possible through any other way.
Updated HTML
<select name="inpName" ng-model="person.name" ng-options="i as i.name for i in personMap track by i.id" required>
<option value="">Select one </option> </select>
<div ng-messages="form.inpName.$error" ng-if="form.inpName.$touched">
<div ng-message="required">Required field</div>
</div>
</div>
这篇关于AngularJS:ngMessages 不能与选择中的 ng-options 一起使用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
更多推荐
[db:关键词]
发布评论