Question

我想知道是否有人可以帮我解决这个问题：

我有一个表格，浏览器中已经显示了一些字段（标题，日期......）。这些是必需的（使用＆＃34;必需＆＃34;属性）

但问题是用户可以选择＆＃34;添加副标题＆＃34;

对于良好的用户体验，如果该字段留空，我希望如果他选择添加字幕（通过点击显示该字段的链接），他会收到警告但我不一定想要该字段必填，只有警告，例如＆＃34;您要求提供字幕字段，但您尚未指定任何字段......＆＃34;。

AngularJS中这种实现的最佳实践是什么？

编辑：我需要这个用于ng-repeat的字段...我创建了这个：

<div class="form-group" data-ng-repeat="subtitle in spectacle.subtitles">
    <data-ng-form name="subtitleForm">
        <label for="txtSubtitle" class="col-sm-3 control-label">Sous-titre {{ $index + 1 }}</label>
        <div class="col-sm-9">
            <div class="input-group">
                <input type="text" class="form-control" id="txtSubtitle" name="txtSubtitle" data-ng-model="subtitle.value">
                <span class="input-group-addon"><a href="" data-ng-click="remove(spectacle.subtitles, $index)"><span class="glyphicon glyphicon-remove"></span></a></span>
            </div>
            <span class="help-block" ng-show="!subtitleForm.txtSubtitle.$pristine && subtitleForm.txtSubtitle.$error.blur"><p class="text-danger">You forgot the subtitle</p></span>
            <a href="" data-ng-show="$last && spectacle.subtitles.length < 3" data-ng-click="addNewSubtitle()">Ajouter un sous-titre</a>
        </div>
    </data-ng-form>
</div>

但是控制器部分无法读取属性＆ttxtSubtitle＆＃39;未定义的控制器：

$scope.saveSpectacle = function() {
    console.log('HI');
    $scope.subtitleForm.txtSubtitle.$pristine = false;
    $scope.subtitleForm.txtSubtitle.$error.blur = true;
    //s$scope.spectacle = {};
};

非常感谢

-Eric

Answer 1

您可以使用以下引导程序将错误消息添加到您的字段：

<span class="help-block" ng-show="!formName.subtitle.$pristine && formName.subtitle.$error.blur"><p class="text-danger">You forgot the subtitle</p></span>

当用户点击确认您可以激活错误

$scope.formName.subtitle`.$pristine = false;
$scope.formName.subtitle.$error.blur = true;

或检查值是否为空

$scope.formName.subtitle === ""

这不是必需的，但会检测用户是否将该字段留空，即使用户没有＆＃34;脏＆＃34;该领域

如果添加的字段是原始的（不是必需的），AngularJS会警告用户

1 个答案: