The ng-show
and ng-hide
directives show or hide a portion of the DOM tree (HTML)
conditionally.
<ANY ng-show="{expression}"> ... </ANY>
<ANY class="ng-show: {expression};"> ... </ANY>
ng-show – {expression} –
If the expression is truthy then the element is shown or hidden respectively.
Click me: <input type="checkbox" ng-model="checked"><br/> Show: <span ng-show="checked">I show up when your checkbox is checked.</span> <br/> Hide: <span ng-hide="checked">I hide when your checkbox is checked.</span>
it('should check ng-show / ng-hide', function() { expect(element('.doc-example-live span:first:hidden').count()).toEqual(1); expect(element('.doc-example-live span:last:visible').count()).toEqual(1); input('checked').check(); expect(element('.doc-example-live span:first:visible').count()).toEqual(1); expect(element('.doc-example-live span:last:hidden').count()).toEqual(1); });