Ng-Wiederholung, erstes Element mit anderer Anweisung

Bekam ich den folgenden code:

<div ng-repeat="i in placeholders" square class="set-holder {{i.class}}" droppable="{{i.type}}"></div>

Ist, wie mache ich das erste Element hat die Richtlinie bigsquarewährend die anderen gerade square.

Ich versucht habe:

<div ng-repeat="i in placeholders" {{= $first ? 'big' : ''}}square class="set-holder {{i.class}}" droppable="{{i.type}}"></div>

aber leider habe ich das Ergebnis:

<div ng-repeat="i in placeholders" {{= $first ? 'big' : ''}}square class="set-holder test" droppable="3"></div>

ein.k.ein. die Bindung nicht bekommen, zusammengestellt.

InformationsquelleAutor der Frage Deepsy | 2014-02-03

  1. 3

    Sehen diese Geige http://jsfiddle.net/nicolasmoise/xLfmK/2/.

    Können Sie erstellen eine Richtlinie, an die Sie übergeben einen Zustand. Je nach Beschaffenheit wird es entweder der Platz oder das große Quadrat als solche.

             <div ng-repeat="repeat in repeater" condition="$first" square></div>

    Hinweis
    Wenn Sie nicht wollen, zu ändern, die Richtlinien, Sie sind bereits gemacht, können Sie immer square einen master-Richtlinie, die fordert, die andere zwei.

    InformationsquelleAutor der Antwort NicolasMoise

  2. 2

    Wenn es Ihnen nichts ausmacht mit anderen <div> im inneren des <li> Sie sollten in der Lage sein, um Weg mit dabei bedingte Blöcke von <div> mit ng-if="$index == ??".

    Vielleicht so etwas wie dieses:

    <div ng-repeat="i in placeholders">
  <div bigsquare class="set-holder {{i.class}}" droppable="{{i.type}}" ng-if="$index == 0">
    ...
  </div>
  <div mediumsquare class="set-holder {{i.class}}" droppable="{{i.type}}" ng-if="$index == 1">
    ...
  </div>
  <div square class="set-holder {{i.class}}" droppable="{{i.type}}" ng-if="$index > 1">
    ...
  </div>
</div>

    Es ist ein wenig Ausführlicher, aber es schön ist, trennt sich die Vorlagen, so dass Sie können Sie haben, ziemlich unabhängig von einander.

    InformationsquelleAutor der Antwort subdigit

  3. 1
    <!-- Here is a code sample which I used in one of my angularjs ionic apps.  -->
<!-- Regular ng-repeat -->
<!-- ng-if="$first" to determine <input focus-input> or not -->
<ion-item class="item item-input item-stacked-label" ng-repeat="input in template.inputs">
  <label class="input-label bh-dark" for="{{input.id}}">{{input.title}}</label>
  <div class="clearfix">
    <div class="bh-left">
      <input ng-if="$first" focus-input id="{{input.id}}" type="{{input.type}}" placeholder="{{input.choices[0]}}" ng-model="input.answer">
      <input ng-if="!$first" id="{{input.id}}" type="{{input.type}}" placeholder="{{input.choices[0]}}" ng-model="input.answer">
    </div>
    <div class="bh-right">
      <i class="icon ion-ios-close-empty bh-icon-clear" ng-click="clearField(input.id)" ng-show="input.answer"></i>
    </div>
  </div>
</ion-item>

    InformationsquelleAutor der Antwort ethanneff

Schreibe einen Kommentar