Autoscroll down angularjs

javascript jquery angularjs angularjs-directive autoscroll
user1424508 picture user1424508 · Nov 9, 2013 · Viewed 14.9k times · Source

Hi I'm creating a chat app with angularjs that autoscrolls down when a user messages another user. I'm not sure how to implement this as my chat window is a fixed ul element. I'm thinking I will need to implement a directive to do this (inboxmsg-scroll on the ul element)

Any help? thanks.

HTML

<ul class="chatting-window" inboxmsg-scroll>
    <li data-ng-repeat="messageinfo in messages">
        <div class="message-date">
            {{messageinfo[0]}}
        </div>
    </li>
</ul>

Answer

Răzvan Flavius Panda picture Răzvan Flavius Panda · Apr 11, 2014

angularjs-scroll-glue

An AngularJs directive that automatically scrolls to the bottom of an element on changes in it's scope.

Link: https://github.com/Luegg/angularjs-scroll-glue

Related questions

Call method in directive controller from other controller

I have a directive that has its own controller. See the below code: var popdown = angular.module('xModules',[]); popdown.directive('popdown', function () { var PopdownController = function ($scope) { this.scope = $scope; } PopdownController.prototype = { show:function (message, type) { this.scope.message = message; this.…

Read More
Modifying DOM (slideDown/slideUp) with AngularJS and jQuery

I'm trying to implement a slideDown/slideUp animation with AngularJS. I can't use CSS3's transition (unfortunately) since the height is set to auto (and I don't want to use the max-height workaround), so I'm trying to use jQuery's slideToggle …

Read More
How to create an angularJs wrapper directive for a ui-bootstrap datepicker?

I am using the ui.bootstrap.datepicker directive to display some date field. However most of the time I need the same setup: I want it to come along with a popup and a popup button and also I want …

Read More