angularjs - 未应用 ng-class

Question

我有一个包含要发布的消息的文本区域和一个仍然可用的字符数的跨度。

<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 , maxMessageLength和 messageLengthAlertTreshold都在 $scope 中定义，当我在 textarea 中插入文本时，跨度内的计数器会正确更新，更改 messageText.length 的值.

但是，css 类 message-length 都没有。也不是 message-length-alert无论 messageText 中包含的值如何，都曾应用于我的跨度.

我还尝试删除 message-length-alert 的检查只留下 ng-class 属性 {message-length: true} ，但无论如何它都没有应用。

我错过了什么？

Answer 1

尝试用引号将类名括起来。代替:

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

尝试:

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

这是因为哈希键必须是字符串或类似变量的名称。