AngularJS ng-message指令始终显示消息

时间:2018-09-20 18:04:08

标签: javascript angularjs ng-messages

我试图在视图中设置需要选择的字段。所以我的view.html中有以下标记

<form name="homeForm">
  <div class="form-group col-md-6 md-padding">
    <div>
        <label style="font-size: medium">Laboratory Name</label>
        <select name="labName" class="form-control" ng-model="request.labName" required>
            <option ng-repeat="lab in labList" value="{{lab.id}}">{{lab.value}}</option>
        </select>
        <div style="color:maroon" ng-messages="homeForm.labName.$error"
             ng-if="homeForm.requestTypeName.$touched">
            <div ng-message="required">This field is required</div>
        </div>
    </div>

我希望This field is required仅在没有选择数据时显示。但是无论该字段是否有数据,This field is required都会显示如下 enter image description here

这里有什么我想念的吗

3 个答案:

答案 0 :(得分:3)

您需要在输入和ng-message中设置相同的输入名称。这样做,您甚至不需要ng-if。例如:

<form name="form">
  <input name="fullname" type="text" ng-model="fullname" required/>
  <div ng-messages="form.$submitted && form.fullname.$error">
    <p ng-message="required" class="help-block">This field is required</p>
  </div>
</form>

在这种情况下,我使用的是form。$ submitted。您可以删除它,将其替换为touched / dirty或其他任何东西。原理是一样的。

答案 1 :(得分:1)

您在import random random.randint(1,10) #no. between 0 and 10 中使用homeForm.requestTypeName,并且没有名为ng-if的输入控件,我想您必须像在{{1 }}属性。

基本上,将requestTypeName更改为homeForm.labName

TL; DR;

您还可以使用ng-message来检查最终用户是否确实在没有输入任何输入的情况下就忽略了该字段。

来源:https://docs.angularjs.org/api/ng/directive/ngRequired

答案 2 :(得分:1)

ins = client.institutions.get_by_id_with_logo(YOUR_INSTITUTION_ID) puts ins.institution[:logo] 指令位于单独的库模块中,必须作为依赖项包含在内。

示例

ng-messages

JS

<script src="//unpkg.com/angular/angular.js"></script>
<script src="//unpkg.com/angular-messages/angular-messages.js"></script>

有关更多信息,请参见AngularJS ngMessages Module API Reference