ng需要的輸入（不帶標籤）後的紅色星號

我在尋找一個CSS規則，在ng-required屬性的輸入之後應用紅色星號。ng需要的輸入（不帶標籤）後的紅色星號

問題是，在這些輸入上沒有標籤，佔位符被用作標籤。

這2個輸入例如：

<div class="row"> 
    <div class="col-xs-6"> 
     <input type="text" name="CACLastName" ng-model="cac.lastName" placeholder="NOM" ng-required="true" ng-disabled="$parent.isDisabled" class="form-control"/> 
    </div> 
    <div class="col-xs-6"> 
     <input type="text" name="CACFirstName" ng-model="cac.firstName" placeholder="Prénom" ng-required="true" ng-disabled="$parent.isDisabled" class="form-control"/> 
    </div> 
</div>

所以我試着用:after但沒有成功發揮。此外，:required僅適用於required屬性，而不適用於ng-required。

來源

2016-09-22 Ellone

的[？在輸入欄上僞元素後，我可以用]可能的複製。 com/questions/2587669/can-i-use-the-after-pseudo-element-on-an-input-field） –

檢查http://stackoverflow.com/questions/2587669/can-i-use-the -after-pseudo-element-on-an-input-field 它解釋了爲什麼你不能在輸入元素上做到這一點，也有一些關於如何通過添加其他元素來實現它的想法，但是你會有打包你的指令，或者擴展ng-required。 –

我試過CSS，並且選擇器似乎根本不能用於輸入元素，而它將適用於div元素。你可以試試下面，你將看到星號的div之後插入，而不是input後：

<div class="row"> 
    <div class="col-xs-6"> 
     <input type="text" name="CACLastName" ng-model="cac.lastName" placeholder="NOM" ng-required="true" ng-disabled="$parent.isDisabled" class="form-control"/> 
    </div> 
    <div class="col-xs-6"> 
     <input type="text" name="CACirstName" ng-model="cac.firstName" placeholder="Prénom" ng-required="true" ng-disabled="$parent.isDisabled" class="form-control"/> 
    </div> 
</div> 

<div class="text-div" ng-required="true"> 
    TEST DIV LOOK --> 
</div>

CSS：

[ng-required]:after { 
    content: "*" 
}

OUTPUT：

Jsfiddle live example of problem

在我看來，這是一個JavaScript的工作。隨着你的HTML，這段代碼就可以了（原生JS）：（HTTP：//計算器：

var form_inputs = document.getElementsByClassName('form-control') 

for (var i = 0; i < form_inputs.length; i ++) { 
    if (form_inputs[i].hasAttribute('ng-required')) { 
    form_inputs[i].insertAdjacentHTML('afterend', '<span style='color: red;'>*</span>'); 
    } 
}

Jsfiddle solution

來源

2016-09-22 09:17:34

ng需要的輸入（不帶標籤）後的紅色星號

回答

相關問題