ttmt ttmt - 2 months ago 23
AngularJS Question

Angular change text based on variable

I'm hiding or showing a div when a button is clicked.

I want to change the text in the link to say "show" / "hide".

I have it working but is there a better way to change the text rather than checking for the variable on two seprate spans.

<a ng-click="showHint = !showHint"><span ng-if="showHint">Hide</span><span ng-if="!showHint">Show</span> tips</a>

<div ng-if="showHint">
<p>
Hint text Hint text Hint text Hint text
</p>
</div>

Answer

Check this, hope it works for you:

<span ng-bind="showHint ? 'Hide' : 'Show'"></span>

Complete Snippet:

<a ng-click="showHint = !showHint">
    <span ng-bind="showHint ? 'Hide' : 'Show'"></span> tips
</a>

OR

<a ng-click="showHint = !showHint">
    <span ng-bind="showHint ? 'Hide tips' : 'Show tips'"></span>
</a>
Comments