https://i.sstatic.net/fWF8M.png https://i.sstatic.net/fWF8M.png
Check out this code snippet:
var app = angular.module('umovie-app');
app.directive('renamable', function($sce) {
return {
scope: {
model: '=model',
},
link: function(scope, elements, attributes) {
var input = elements[0];
scope.trustHtml = $sce.trustAsHtml(scope.model.name);
$(input).click(function() {
elements.addClass("active");
$(input).html(`<input type="text" value="${scope.model.name}">`).unbind("click");
});
$(input).on('focusout', function() {});
},
template: '<a class="renamable">{{ trustHtml }} <i class="material-icons">mode_edit</i></a>',
};
});
Can someone please advise me on how to eliminate the quotation marks added by Angular around my trustHtml variable when binding it?
Thank you for any help!
EDIT: The current outcome has the icon slightly misaligned with my <a></a> element.