AngularJS——仅当触摸并为空时才显示div

我试图仅当输入字段被触摸并且仍然为空时才显示div

我已经尝试了以下代码，但是div没有出现。由于某种原因，它无法读取我认为的触摸状态

知道我做错了什么吗

<div class="col-xs-12 mainbox" >
<form name="loginForm">
    <div class="spacing"></div>
      <h5>Please input your data:</h5>
      <input ng-model="vm.username" type="text" placeholder="Username" class="form-control input-md">
      <div class="spacing">
          <div class="alert alert-danger" ng-if="!vm.username && vm.username.$touched">
              Please put your username!
          </div>
      </div>
      <input id="textinput" name="textinput" type="text" placeholder="Κωδικός" class="form-control input-md">
      <div class="spacing"></div>
      <button id="singlebutton" name="singlebutton" class="btn btn-info btn-sm pull-right">Είσοδος</button>
</form>

请输入您的数据：
请输入您的用户名！
Είσοδος

---

另外，当我删除$touch条件时，只有当输入用户名为空时，div才会完美显示。

您可以在输入字段上使用

ng focus

和

ng blur

事件

---

看看这个

您需要为输入控件设置name属性来完成任务。 您还需要访问$touch，如loginForm.userName.$touch

<form name="loginForm">
<div class="spacing"></div>
  <h5>Please input your data:</h5>
  <input ng-model="vm.username" name="userName" type="text" placeholder="Username" class="form-control input-md">
  <div class="spacing">
      <div class="alert alert-danger" ng-if="!vm.username && loginForm.userName.$touched">
          Please put your username!
      </div>
  </div>
  <input id="textinput" name="textinput" type="text" placeholder="Κωδικός" class="form-control input-md">
  <div class="spacing"></div>
  <button id="singlebutton" name="singlebutton" class="btn btn-info btn-sm pull-right">Είσοδος</button>

请输入您的数据：
请输入您的用户名！
Είσοδος

---

希望能有帮助

你想用这些美元做什么？为什么不尝试使用ngMouseover或ngMouseup。。。或者其中一些事件。。。并绑定一个在其中任何一个上变为true/false的变量，然后在ng中使用该变量，如果。。。不知道你想做什么though@Marko当一个div触摸输入字段时，试图用alert显示一个div，但没有输入任何内容。是的，但是什么是“触摸”事件？如果只是angularJS网络应用，那就是ngMouseUp。。。因此，您可以使用绑定一个变量的逻辑，该变量将在该变量上更改为true/falseevent@Marko它也可能是一个标签。问题是如何使它与$touch一起工作，因为我看到ng touch类应用于字段。这就是我的意思，这正是我在评论中的意思，只需找出要使用的鼠标事件此代码的问题是，在键入之前单击内部时会显示消息。只有当您离开该字段并且仍然为空时，消息才会出现。完美答案，就是这样。因此，您不能将$touch用于ng模型，而只能用于名称属性，对吗？是的，您是正确的。请查看更多详细信息。如果你也投票，那就太好了；）