我有一个固定在浏览器窗口右侧的 div。在该 div 中是一个容器，其中包含通过 ng-repeat 传播的 div 元素。这些 div 元素中包含的数据是来自对 HTML 请求的响应的消息。出于某种原因，一旦 div 元素传播，我无法让这个容器滚动到容器的底部。我曾尝试将 $location 与 $anchorScroll 一起使用，并尝试使用普通的 javascript getElementByID 手动执行此操作。我知道请求是异步发生的，我尝试过使用承诺和超时，但由于某种原因，我无法让这个 div 自动滚动。
以下是所有相关代码，如果有人能够指出我正确的方向，我将不胜感激！
这是我的玉：
ul.dropdown-menu
li(ng-repeat="group in groups")
a(ng-click="loadGroup(group.id)") {{group.name}}
div(class='messages-container')
.message-box(ng-repeat="message in messageIndex.messages| orderBy:'created_at'")
这是我的CSS：
.messages-container {
margin-bottom: 100px;
width: 700px;
height: 600px;
overflow-y: scroll;
display: block;
这是我的控制器：
app.controller('GroupMeCtrl',
['$scope', '$http', '$templateCache', '$location', 'Auth', 'MyMessageLoad',
function($scope, $http, $templateCache, Auth, MyMessageLoad) {
$scope.loadGroup = function($groupID){
$scope.messageIndex = new MyMessageLoad();
$scope.messageIndex.nextPage($groupID);
};
}]);
这是我的工厂：
app.factory('MyMessageLoad', function($http, $templateCache) {
var MessageLoad = function() {
this.messages = [];
this.beforeID = '';
};
MessageLoad.prototype.nextPage = function($groupID) {
var urlString = 'https://api.groupme.com/v3/groups/' + $groupID + '/messages?'+ this.beforeID;
$http({method: 'GET', url: urlString}).success(function(data) {
var messages = data.response.messages;
for (var i = 0; i < messages.length; i++) {
this.messages.push(messages[i]);
}
this.beforeID = "&before_id=" + this.messages[this.messages.length - 1].id;
}.bind(this));
};
return MessageLoad;
});
这是将 div 固定在浏览器窗口右侧的 Javascript，以防万一有重要的东西受到干扰：
sidebarwidth = $(".sidebar-width").css('width');
bodypaddingtop = $(".navbar-fixed-top").css('height');
sidebarheight = $("body").css('height');
$('.sidebar-nav-fixed').css('width', sidebarwidth);
$('.sidebar-nav-fixed').css('height', sidebarheight);
$('body').css('paddingTop', bodypaddingtop);
contentmargin = parseInt(sidebarwidth);
$('.span-fixed-sidebar').css('marginLeft', contentmargin);
$('.span-fixed-sidebar').css('paddingLeft', 60);