how to set backgroundImage of DIV using angular response.data

Question

I used to set the background image of a div with a get request like so:

style="background-image:url('/api/image')"

Now I want to do an $http request in Angular, get the image from response.data, and then set it like so:

document.getElementById("img").style.backgroundImage = response.data;

Answer 1

Your controllers should have no knowledge of your DOM. You should be attaching the data to your $scope and then applying it in your view.

$scope.imagePath = response.data;

and in your view.

<span id="img" style="background-image:url('{{imagePath}}')"></span>