angularjs - ngMessages: AngularJS を使用した電子メールの検証

Question

AngularJS と ngMessages でメール フィールドを検証したいだけです。

3 つの検証ルールが必要です。

• 必須
• 最大長
• Eメール

これらの用語のいずれかで検証が失敗し、入力フィールドがdirtyRequiredの場合に、エラーメッセージ + エラー境界線を表示したいと思います。Maxlength

Emailとりあえずバリデーション失敗時のエラーメッセージ＋エラーボーダーを表示したいのですが、それで入力欄をタッチしただけです。汚れている場合は、電子メールのエラー メッセージを表示したくありません。エンド ユーザーにとって煩わしいからです。

これが私のコードです：

<input 
    type="email" 
    placeholder="Email" 
    name="emailField" 
    ng-model="emailField" 
    ng-class="{'error-border': (form.emailField.$dirty && form.emailField.$error && !form.emailField.$error.email)}"
    required
    ng-maxlength="10"
>
<div class="form-error" ng-messages="form.emailField.$dirty && form.emailField.$error && !form.emailField.$error.email">
    <p ng-message="required" class="ferror">
        <i class="delete"></i>
        Email is required.
    </p>
    <p ng-message="maxlength" class="ferror">
        <i class="delete"></i>
        Email is too long.
    </p>
    <p ng-message="email" class="ferror">
        <i class="delete"></i>
        Email is invalid.
    </p>
</div>

しかし、それは機能していません。

誰でもこれで私を助けることができますか？