显示无效字段的红色星标

Question

我想在无效的文字输入之前添加一个红星。 像

这样的东西

.ng-invalid:before
    { 
        content: "*"; 
        color: Red; 
    }

不幸的是，似乎：之前并不总是为输入工作。 怎么办？

Answer 1

除去

修改

您需要将元素放在div中，并将:before属性，或放在一个使用{{*的单独元素中。 1}}有效性。

最初误解了这个问题，但是，是的。

Answer 2

感谢。 为了使解决方案可重用，我创建了指令：ngErrorShow 它在输入之前添加一个星形元素，并使用ngShow来显示/隐藏星形。

portaldirectives.directive("ngErrorShow", function ($compile) { 
    return { 
        restrict: 'A', 
        require: "^form", 
        link: function (scope, element, attrs, ctrl) { 
            var varName = ctrl.$name + "." + attrs.name + ".$valid";           
            var a_input = angular.element($compile('<span style="color:red" ng-show="!' + varName + '" >*</span>')(scope)); 
            element.parent().prepend(a_input); 
        } 
    }; 
});