Füge Text neben ionicons hinzu

Question

Wie man Text neben den ionicons hinzufügt. Ich sehe nur die Iononen, aber der Text kann nicht angezeigt werden. Ich möchte "Mehr" und "Weniger" mit den Iononen anzeigen, wenn der Benutzer darauf klickt.

Beispiel, voreingestellte Bedingung ist Ion-Plus-Zeichen und "Mehr". Klicken Sie auf "Mehr", es wird Ion-Minus und "Weniger" angezeigt. Funktionsweise funktioniert. Nur "mehr und weniger" wird nicht angezeigt.

Unten ist mein Code

<div ng-click="toggleon()" <i class="icon" ng-class="showMore ? 'ion-android-remove-circle assertive' : 'ion-android-add-circle positive'"></i><i class="padding" ng-class="showMore ? 'Less' : 'More'"></i></div> 
</div> 

Answer 1

ng-class verwendet wird, eine CSS-Klasse auf ein Element anzuwenden. Es kann nicht zum Anwenden von Text verwendet werden. Verwenden Sie stattdessen ng-bind. Verwenden Sie auch <span> und nicht <i> für Texte.

<div ng-click="toggleon()"> <i class="icon" ng-class="showMore ? 'ion-android-remove-circle assertive' : 'ion-android-add-circle positive'"></i><span class="padding" ng-bind="showMore ? 'Less' : 'More'"></span></div>