JSFiddle - React, Tailwind, and code Playground

HTML

<div ng-app="testApp" ng-controller="mainCtrl">
    <span icon="icon">Icon: {{icon}}</span>
    <br />
    <span icon="iconEncoded">Icon encoded: {{iconEncoded }}</span>
</div>

JavaScript

var m = angular.module('testApp', []);

m.controller('mainCtrl', function($scope, $sce){
    $scope.icon = '&#xe070;';
    $scope.iconEncoded = '&amp;#xe070;';
});

m.directive('icon', function(){
    var div = document.createElement('div');
    
    return {
        scope: {
            icon:'='
        },
        link: function($scope,$element,$attrs){            
            var originalIcon;
            $scope.decodedIcon = $scope.icon;
            do {
                originalIcon = $scope.decodedIcon;
                div.innerHTML = originalIcon;
                $scope.decodedIcon = div.firstChild.nodeValue;
            } while (originalIcon != $scope.decodedIcon); 
            console.log('data-icon', $scope.decodedIcon);
            $attrs.$set('data-icon', $scope.decodedIcon);
        }
    };
});