简体   繁体   中英

Angularjs : Show the count of new messages

I am currently working on a Chat application and there I want to show the count of new messages.

    <div class="people"  >
        <div ng-repeat="user in allCompanyUsers">
            <div class="person" ng-click="activateChat(user); bubble=true" id="chat_{{user.id}}">
                <img alt="" />
                <span class="name" >{{user.firstName}} {{user.lastName}}
                <span ng-if="!bubble" class="noti_bubble">{{count}}</span></span> 
                <span class="preview"></span>
            </div>
        </div>
    </div>  

    <div class="chat active-chat">
            <div ng-repeat="c in activeConversations track by c.time| orderBy:'time':false">
                <div class="bubble" ng-class="c.type">
                   {{c.message}} &nbsp;&nbsp;&nbsp;&nbsp;
                   <span class="user_message">{{c.time | date:'yyyy-MM-dd HH:mm:ss'}}</span>
                </div>
            </div>
        </div>

Any kind of help will be appreciated and thanks in advance...

You can just use {{activeConversations.length}} in order to get the length/count as:

 <div class="people"  >
    <div ng-repeat="user in allCompanyUsers">
        <div class="person" ng-click="activateChat(user); bubble=true" id="chat_{{user.id}}">
            <img alt="" />
            <span class="name" >{{user.firstName}} {{user.lastName}}
            <span ng-if="!bubble" class="noti_bubble">{{activeConversations.length}}</span></span> 
            <span class="preview"></span>
        </div>
    </div>
</div>  

<div class="chat active-chat">
        <div ng-repeat="c in activeConversations track by c.time| orderBy:'time':false">
            <div class="bubble" ng-class="c.type">
               {{c.message}} &nbsp;&nbsp;&nbsp;&nbsp;
               <span class="user_message">{{c.time | date:'yyyy-MM-dd HH:mm:ss'}}</span>
            </div>
        </div>
    </div>

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM