javascript - 将 ng-message 与 ng-required 一起使用

Question

我有一个验证 radio 输入的表单。需要单选输入(用户必须在单击提交按钮之前选择单选字段之一)。我在输入 radio 中使用 ng-required。

radio 输入看起来像这样:

<input type="radio" name="myRadio" value="1" ng-model="theModel" ng-required="!theModel">
<input type="radio" name="myRadio" value="2" ng-model="theModel" ng-required="!theModel">
<input type="radio" name="myRadio" value="3" ng-model="theModel" ng-required="!theModel">

我想在用户提交后在表单中显示一条消息。我使用 ng-message 指令。我这样使用它:

<div class="msg-error-input" ng-if="!theModel" ng-messages="myForm.myRadio" role="alert">
    <div class="icon my-icon" ng-message="required">
        It has to show an error here. But this doesn't seem to work ! It seems that there's no link between the ng-message='required' and the ng-required..
    </div>
</div>

Answer 1

我通过这样做解决了这个问题:

<form name="myForm" id="myForm">
<input type="radio" name="myRadio" value="1" ng-model="theModel" ng-required="!theModel">
<input type="radio" name="myRadio" value="2" ng-model="theModel" ng-required="!theModel">
<input type="radio" name="myRadio" value="3" ng-model="theModel" ng-required="!theModel">
<div class="msg-error-input" ng-if="!theModel && submitted" ng-messages="myForm.myRadio" role="alert">
    <div class="icon my-icon" ng-message="required">
        It has to show an error here. But this doesn't seem to work ! It seems that there's no link between the ng-message='required' and the ng-required..
    </div>
</div>
<button type="submit" data-ng-click="submitted"/>
</form>

(我看到ng-subscribed没有添加到我的表单中，所以我添加了一个点击时提交的变量)