Question

如果用户无法在id为addchipnumber的输入字段中添加正确数量的字符，我想显示一条消息。最小长度为15，最大长度为15。我还没有这个工作....我似乎不应该那么难。

<div class="modal-header">
    <h3 class="modal-title">Lägg till/ändra ID-nummer</h3>
</div>
<div class="modal-body">
    <div class="form-group">
        <label for="addchipnumber">Chipnummer</label>
        <input type="text" id="addchipnumber" class="form-control" ng-model="data.idNumber" mask="999999999999999" restrict="reject" required >
        <p><small>Chipnummer består av 15 siffror.</small></p>
    </div>
    <div class="form-group">
        <label for="addtattoonumber">Tatueringsnummer</label>
        <input type="text" id="addtattoonumber" class="form-control" ng-model="data.tattooNumber">
        <p><small>Tatueringsnummer består av maximalt 6 tecken</small></p>
    </div>
</div>

<div class="modal-footer" style="text-align: center">
    <button class="btn btn-back text-center" type="button" ng-click="cancel()"><i class="fa fa-times" aria-hidden="true"></i> Avbryt</button>
    <button class="btn btn-green text-center" type="button" ng-click="ok()"><i class="fa fa-check"></i> SPARA </button>
</div>

Answer 1

您要搜索的是ngMessages表单验证。

<form name="myForm">
    <label>
        <input type="text" name="textEntry" ng-model="Chipnummer" ng-minlength="15" ng-maxlength="15" required/>
    </label>

    <div ng-messages="myForm.textEntry.$error" style="color:red">
        <div ng-message="required">You did not enter a field</div>
        <div ng-message="minlength">Input length must be 15 chars</div>
        <div ng-message="maxlength">Input length must be 15 chars</div>
    </div>
</form>

<强> Demo

在这种情况下，如果输入长度小于ng-message值（15），则会出现ngMinlength ＆＃34; minlength＆＃34; 。同样适用于＆＃34; maxlength＆＃34; 。

必填字段必填。

输入长度必须为15个字符

1 个答案: