如何为验证表单创建指令?

时间:2014-09-06 23:04:07

标签: angularjs angularjs-directive

如何使用AngularJS创建验证表单的指令?

请参阅我的代码:

cshtml文件:

<div class="error"
     ng-show="{{ngNameForm}}.{{ngNameFieldEn}}.$dirty && {{ngNameForm}}.{{ngNameFieldEn}}.$invalid">
    <small class="error"
           ng-show="{{ngNameForm}}.{{ngNameFieldEn}}.$error.required">
        Your {{ngNameFieldFa}} is required
    </small>
    <small class="error"
           ng-show="{{ngNameForm}}.{{ngNameFieldEn}}.$error.minlength">
        Your {{ngNameFieldFa}} is required to be at least 3 characters
    </small>
    <small class="error"
           ng-show="{{ngNameForm}}.{{ngNameFieldEn}}.$error.maxlength">
        Your {{ngNameFieldFa}} cannot be longer than 20 characters
    </small>
</div>

指令:

.directive('angularValidate', function() {
        return {
            restrict: 'E',
            replace: true,
            scope: {
                ngNameFieldFa:'@',
                ngNameFieldEn:'@',
                ngNameForm:'@'
            },
            templateUrl: getBaseUrl() + 'Angular/ValidateMessage',
        };
    })

示例:

 <div class="form-group">
        <label for="input2" class="col-sm-2 control-label">NameFa :</label>
        <div class="col-sm-10">
            <input ng-model="tableService.electedRecord.NameEn" required
                   ng-minlength=2
                   name="NameEn"
                   ng-maxlength=50
                   type="text" class="form-control direction-left" id="input2">

            <angular-validate ng-name-field-fa="NameFa"
                              ng-name-field-en="NameEn"
                              ng-name-form="add_form">
            </angular-validate>
        </div>
    </div>

如何使用AngularJS创建验证表单的指令?

为什么不显示错误信息?

0 个答案:

没有答案