AngularJS Example:

by Sajeetharan Sinnathurai

HTML

<div ng-controller="countryMapper" ng-app="myApp">   
        <div background-image="{{url}}" style="height: 500px"> 
   </div>
    
 
</div>

JavaScript

var app = angular.module('myApp', []);
app.controller("countryMapper", function ($scope) {     $scope.url="https://static.vecteezy.com/system/resources/previews/000/050/156/original/9-stylish-vector-world-map-vector.jpg";
});

app.directive('backgroundImage', function () {
    return function (scope, element, attrs) {
        element.css({
            'background-image': 'url(' + attrs.backgroundImage + ')',
            'background-repeat': 'no-repeat',
        });
    };
});