使用指令在另一个下显示错误消息。 Angular.js

时间:2017-03-28 20:21:47

标签: javascript angularjs

我正在对指令进行验证,强制用户选中该复选框。如果未标记复选框,则会显示错误消息。我的问题是消息转移到复选框的文本。

style="margin-top:5px;color:red;"

enter image description here

我需要复选框末尾的验证消息。但我不希望它影响演示文稿或此消息高于其他元素。

style="position: absolute;margin-top:5px;color:red;"

enter image description here

我需要在指令中执行此操作,我不想触摸控制器或模板。怎么办?

    app.directive('validate', function ($timeout) {

        return {
            restrict: 'AE',
            require: 'ngModel', 

            link: function (scope, element, attrs, ngModel) {
              if (!ngModel){
                return;          
              }
              ngModel.$setValidity('validation', false);

              scope.directive_function= function(){
                alert("directive function");
              }

              ngModel.$parsers.push(function(val){
                if(val==true){
                  ngModel.$setValidity('validation', true);
                  var elemento_eliminar=(angular.element((document.getElementById('errorchec' ))));
                  elemento_eliminar.remove();
                }else{
                 ngModel.$setValidity('validation', false);
                 var newDirective = angular.element('<div id="errorchec" class="span_wrong" style="margin-top:5px;color:red;">'+"must be required"+'</div>');
                 //style="position: absolute;margin-top:5px;color:red;"
                element.after(newDirective);
                }
              })
           }


        };
    });

http://jsfiddle.net/2kt4ukcx/

1 个答案:

答案 0 :(得分:0)

如果它适合您,则可以style="position:absolute; top:5px;color:red;