web-dev-qa-db-fra.com

ng-class non appliqué

J'ai une zone de texte contenant un message à publier et une étendue avec le nombre de caractères encore disponibles.

<textarea name="" cols="" rows="" maxLength="{{maxMessageLength}}" ng-model="messageText"/>
<div id="chatmessage-buttons">              
    <a ng-click="sendMessage()"><span>Invia</span></a>
<span ng-class="{message-length-alert: (messageText.length > messageLengthAlertTreshold), message-length: true}">{{maxMessageLength - messageText.length}}</span>
</div>

messageText, maxMessageLengthet messageLengthAlertTresholdsont tous définis dans le $scope, et le compteur à l'intérieur de la plage est correctement mis à jour lorsque j'insère du texte dans la zone de texte, en modifiant la valeur de messageText.length.

Cependant, ni la classe css message-lengthnor message-length-alertsont jamais appliqués à ma plage, quelle que soit la valeur contenue dans messageText.

J'ai également essayé de supprimer le chèque pour message-length-alert laissant l'attribut ng-class avec juste {message-length: true}, mais il n'est pas appliqué de toute façon.

Qu'est-ce que je rate?

angularjsng-class
26
Raibaz

Essayez de mettre le nom de la classe entre guillemets. Au lieu

ng-class="{message-length-alert: (messageText.length > messageLengthAlertTreshold), message-length: true}

Essayer

ng-class="{'message-length-alert': (messageText.length > messageLengthAlertTreshold), 'message-length': true}

C'est parce que la clé de hachage doit être une chaîne ou un nom de type variable. (Désolé pour mon mauvais anglais)

69
ardentum-c