Je tente d'ajouter des styles CSS à une chaîne calculée en JavaScript. Elle passe par une série de fonctions de transformation :
var fieldSetTransformation = setFieldTransformation(iteration);
fieldSetTransformation = stylePropertyName(fieldSetTransformation);
Cette valeur est ensuite passée à un tableau généré dans une directive à travers ng-repeat d'AngularJS :
{{line[column.key] !== undefined ? line[column.key] : '--'}}
Je lutte donc pour l'ajouter à un conteneur existant.
Qu'est-ce que j'ai essayé jusqu'à présent ?
Injecter directement du HTML dans la valeur retournée :
var htmledField = [
'' + fieldSetTransformation,
''].join("\n");
];
Aucune utilité, car cela ne semble plus être accepté par les navigateurs actuels (corrigez-moi si je me trompe) car c'est un problème de sécurité.
Le résultat obtenu est simplement 000000
qui apparaît dans le tableau.
Créer l'élément, puis l'ajouter dans la vue
Aussi un échec :
function stylePropertyName(data){
var newSpan = document.createElement('span');
newSpan.setAttribute('class', 'propertyNameHighlight');
document.getElementsByClassName("tableBody").appendChild(newSpan);
newSpan.innerHTML = data;
return data;
}
Cela retourne une exception de fonction nulle.
J'ai également vérifié cette question, qui semblait la plus proche de ma requête, mais dans mon cas il n'y a pas de conteneur clair pour envelopper la chaîne résultante.
TL;DR : Ce que j'essaie de réaliser ?
Ce texte vert ici :
Cela représente une cellule. Les données ne sont pas transmises directement, elles sont générées dynamiquement à travers une série de fonctions et de ng-repeats.
Toute aide ou question connexe que je pourrais obtenir est grandement appréciée. Merci !