使用指令在另一個下顯示錯誤消息。 Angular.js

Question

我正在對指令進行驗證，強制用戶選中該框。 如果未選中該復選框，則會顯示一條錯誤消息。 我的問題是消息轉移到復選框的文本。

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

我需要復選框末尾的驗證消息。但是我不希望它影響演示或該消息位於其他元素之上。

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

我需要在指令中執行此操作，我不想觸摸控制器或模板。 怎么辦

    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/

Answer 1

如果對您來說是正確的解決方案，則可以使用style="position:absolute; top:5px;color:red;