Html 如果用户存在angularjs，则在文本框旁边显示错误标签

我有一张带有文本框用户名的登记表。我想做的是，当输入的用户名存在时，文本框旁边有一个标签，显示“用户名存在”，而不单击提交按钮。到目前为止，我所做的是：任何帮助都将不胜感激

我的代码示例：

<div ng-app="myApp" ng-controller="check">
<div class = "container">
    <h3>Registration form</h3>    
      <form name = "myForm">
             <label>Username:</label>
                <input type = "text" id = "user" ng-model="username"></input>
             <div class="msg-block" ng-show="myForm.$error"> <span class="msg-error" ng-show="myForm.user.$error.user">User exists.</span> 
     </form>
    <button ng-click = "userExists(username)">Submit</button>

登记表
用户名：
用户存在。
提交

---

您的客户端需要一组用户（就安全性而言，这不是一个好做法）

---

不要调用函数submit按钮，而是在输入框中使用它（根据需要使用ng blur或ng change）

您可以根据现有用户变量上的值显示错误消息

   var app = angular.module("myApp", []);
    app.controller('check', function ($scope) {

        $resource('someUrl').query({}, function(users){
             $scope.users = users;  //users is : ["foo", "bar", "admin", ...]
        }, function (error){
             //handle error here
        });

        $scope.userExists = function(username){
            if($scope.users.indexOf(userName) > 0){
                alert("user exists!");
            }else {
                alert("save");
            }
        };


    });

    <input type = "text" id= "user" ng-model="username" ng-blur="userExists(userName)"></input>
    <div ng-if="existingUser">User already exists !!!</div>

$scope.userExists = function(username){
            if($scope.users.indexOf(userName) > 0){
                $scope.existingUser=true;
            }else {
                $scope.existingUser=false;
            }
        };