Toxicable Toxicable - 5 months ago 9
AngularJS Question

Angular 1.5 UI not updating till user makes another input

So im building a pretty simple chat App with Signal R and Angular however im having an issue where basically the UI wont update until the user makes an input IE clicks into the input box or clicks out of it or presses a key

Here is one of the functions that add to the messageboard

hub.client.broadcastMessage = function (message) {
$scope.messageBoard.push(message)
var element = document.getElementById('messageBoard')
element.scrollTop = element.scrollHeight
}


Here is the website http://coolkidschat.azurewebsites.net/Home (excuse the name, just something random that poped into mind), it's much easier to see what's happening if you just enter a message and press enter you'll notice how nothing will change untill you press another key or click out of the box.

I've tried using
$scope.$apply
but that dosent appear to br doign anything so I've removed it

Edit: just to make it clear on how a message is sent.

User enters message -> sends to Server -> server sends too all clients -> angular appends it to the page

Edit: also just noticed i broke else something on my last publish, working now though

Answer

$scope.$apply() fixes it for me, and it should - your code is being executed outside of Angular's digest cycle. Just place a $scope.$apply() at the end of that method. In the debugger, that fixes the issue on my end.

Comments