title: Can I use a $scope variable as a div background-image
body: <p>I'm trying to set a div <code>background-image</code> via AngularJS $scope variable.
  This is what I have:</p>
  <pre><code>$scope.destination1 = 'web/images/' + obj.FirstPerson + '.png';
  </code></pre>
  <p>Then in the markup, I have this:</p>
  <pre><code>&lt;div style=&quot;background-image:url(destination1)&quot;  class=&quot;destination&quot;&gt;&lt;/div&gt;
  </code></pre>
  <p>I'm learning AngularJS at this time, so pardon if this looks dumb to those familiar with how AngularJS works. Can we do something like this?</p>
  <h2>Update</h2>
  <p>Following the first reply, I did the changes and now the div looks like this:</p>
  <pre><code>&lt;div id=&quot;destination&quot; ng-style=&quot;{'background-image':'url({{destination1}})'}&quot;  class=&quot;destination&quot;&gt;&lt;/div&gt;
  </code></pre>
  <p>That is translated to this in the browser:
  <a href="http://i.gyazo.com/e9e08f738d8ea52ed1ca5e0338692f65.png" rel="nofollow noreferrer">http://i.gyazo.com/e9e08f738d8ea52ed1ca5e0338692f65.png</a></p>
  <p>As you can see the background-image property comes from nowhere with no value assigned, although the ng-class property is populated correctly.
  Any idea what's happening?</p>