AngularJS使用ng-show在ng-click上隐藏div

Question

我的目标是通过点击按钮摆脱错误消息。所以我想我只是在点击按钮时清除该字段，因此，可以获得错误。它在我的第一次测试中起作用。

<div class="errorPopup" 
data-ng-click="runner.Name = null" 
data-ng-show="mainForm.name.$error.pattern">
      <div class="triangle-down pull-left"></div>
      <span>Only letters allowed.</span>
</div>
<input ng-model="runner.Name" data-ng-patter="/(a-z)\" required />

但现在我必须点击一次..清除字段。然后在删除错误div之前单击两次。

我想在一次点击中删除字段和div

Answer 1

您的代码存在一些问题（假设 是一个名为mainForm的包装表单）：

• data-ng-patter应为data-ng-pattern

• 正则表达式不正确。如果您只想允许使用小写拉丁字母：
  /^[a-z]*$/

• 为了检查输入字段中的错误（并通过mainForm.name.$error引用），字段必须具有名称。由于您将其称为mainForm.name，因此需要name的名称（这不是直观的）。选择具有代表性的内容（例如runnerName）并按照以下方式使用：

<input type="text" name="runnerName" ... />

<div ... ng-show="mainForm.runnerName.$error"> 

如果你解决了这些问题，那么每一个似乎都可以正常工作！

---

另请参阅此 short demo 。