Raduken Raduken - 6 months ago 11
AngularJS Question

ng-repeat how to make a specific button not repeat

Right now my button is repeating because I am using

ng-repeat
to repeat the 2 versions buttons in my page, how can make just this button not repeat? that button needs to be together with the other ones, I know I can put this button out and will not repeat, but I need hide this button and make just appear when version buttons appear too.

everything is fine, just that button is repeating, is someway to use ng-repeat="none" or something similar?

Thanks.

html:

<div>
<div class="item"
ng-repeat="version in versions"
ng-class="{active: version.isActive}"
ng-class="{active: }">
<a ng-click="setDiffed(version)"
ng-class="{active: version.isDiffActive}"
name="compare-type"><i></i>
</a>
<h4 ng-click="setMaster(version)">{{ version.label }}</h4>
</div>
<button type="button" class="btn btn-primary">
back to home
</button>
</div>

Answer

You can put this button out and show it only if there are any versions.

Simplified HTML:

<div ng-repeat="version in versions">
  <button>
    {{version}}
  </button>
</div>
<button ng-show="versions.length > 0">
  back to home
</button>

See how it works: http://jsfiddle.net/qd4j6964/

So in your case just add ng-if condition:

<button type="button" class="btn btn-primary" ng-if="versions.length > 0">
  back to home
</button>