ng-repeat how to make a specific button not repeat

Question

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>

inside `ngRepeat` you can check `$first`, `$last`, `$index` - So you can add on the button `ng-if="$first"` so it will be available only on the first repeated element — Alon Eitan, Jun 07 '16 at 13:24
use `ng-if` like seen [here](http://stackoverflow.com/a/21751828/804928) — Abdullah Rasheed, Jun 07 '16 at 13:26

score 1 · Answer 1 · answered Jun 07 '16 at 13:38

1

Try using ng-show or ng-if, somthing like:

<div>
    <div class="item"
      ng-repeat="version in versions"
      ng-class="{active: version.isActive}"
      ng-class="{active: }">
      <a ng-show = "Your condition for showing or not" 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" ng-show = "Your condition for showing or not" class="btn btn-primary">
      back to home
    </button>

  </div>

AngularJS Documentation - ng-show .

answered Jun 07 '16 at 13:38

Itsik Mauyhas

3,824
14
69
114

thanks, but i just wanna hide this: – raduken Jun 07 '16 at 13:50
I can see Your condition for showing or not, I am sorry but I not understand how to do this :( – raduken Jun 07 '16 at 13:52

Łukasz · Accepted Answer · 2016-06-07T13:59:07.517

1

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/

edited Jun 07 '16 at 13:59

answered Jun 07 '16 at 13:52

Łukasz

2,131
1
13
28

ng-repeat how to make a specific button not repeat

2 Answers2