Ajouter des styles personnalisés et comptent innerHTML

je dois définir un style css, quelque chose comme <special> </special>,Ajouter des styles personnalisés et comptent innerHTML

special { 
    color: #000000; 
    background: #ffff00; 
}

et l'utiliser dans un innerHTML. Cependant en angulaire il ne semble pas facile car il a la méthode de désinfection. J'ai essayé l'utiliser de la manière suivante,

result = this.sanitizer.bypassSecurityTrustHtml(result.trim());

En ce moment l'erreur dans la console ne voit plus, bien que mon <special> ne fonctionne toujours pas.

En outre, lorsque vous utilisez la chaîne pour faire le compte de mots, result.length inclura simplement tous les caractères de <special>Hi</special>, pas seulement Hi.

Comment utiliser mon style <special> et de compter les caractères réels qui sont affichés? Je vous remercie.

BTW j'ai essayé d'utiliser trop classe css qui est aussi ne fonctionne pas ...

.special { 
    color: #000000; 
    background: #ffff00; 
}

avec

<div class="special"> Hi </div>

dans la chaîne pour innerHTML.

<div class="special"> Hi </div> fonctionne parfaitement lorsqu'ils ne sont pas avec innerHTML, et outils de développement Chrome, il apparaît comme <div _ngcontent-c4 class="special">Hi</div> Toute idée de ce que _ngcontent-c4 est?

Source

2017-07-24 Charles Zha

Avez-vous besoin d'utiliser un élément personnalisé? Pouvez-vous juste utiliser une classe, puis le styler? – Olian04

En effet, les éléments personnalisés doivent être définis ** en premier ** et sont rarement une bonne idée IMO. –

https://developer.mozilla.org/en-US/docs/Web/Web_Components/Custom_Elements –

C'est une façon de le faire en utilisant une classe pour styler votre élément special.

.special { 
 
    display: inline; 
 
    color: orangered; 
 
}

<html ng-app> 
 
    <script type="text/javascript" 
 
    src="//ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"> 
 
    </script> 
 

 
    <input type="text" ng-model="sometext" /> <!--Proof that this is angualar--> 
 
    <h1>Hello <div class="special">{{ sometext }}</div> </h1> 
 
    
 
</html>

Source

2017-07-24 15:26:05 Olian04

Ajouter des styles personnalisés et comptent innerHTML

Répondre

Questions connexes