ion-list verwenden

  <ion-list>
    <ion-item>
      <ion-label>Stuttgart</ion-label>
    </ion-item>
    <ion-item>
      <ion-label>Kiel</ion-label>
    </ion-item>
    <ion-item>
      <ion-label>Aachen</ion-label>
    </ion-item>
  </ion-list>

• mit ion-list werden ion-item Element vertikal organisiert
• Listen bestehen aus verschiedenen Reihen (alias ion-item)
• die Reihen können verschiedenste Element beinhalten (wie z.B. Buttons, Icons, Text, Eingabefelder usw.)

Attribute

• inset
  • wenn true: margin und runde Ecken
  • Standardwert ist false
• lines
  • wie die unterer Rahmen eines Eintrages dargestellt werden soll
  • Werte: "full" | "inset" | "none" | undefined
• mode mit den Werten "ios" | "md"

Methoden

• closeSlidingItems
  • relevant wenn ion-item-sliding verwendet wird
  • schließt alle offenen ion-item-sliding Elemente
  • gibt den Wert true zurück, wenn ein Element geschlossen wurde

ion-list-header

  <ion-list>
    <ion-list-header>
      <ion-label>Städte</ion-label>
    </ion-list-header>
    <ion-item>
      <ion-label>Stuttgart</ion-label>
    </ion-item>
    <ion-item>
      <ion-label>Kiel</ion-label>
    </ion-item>
    <ion-item>
      <ion-label>Aachen</ion-label>
    </ion-item>
  </ion-list>

• hebt sich visuell von den Einträgen ab
• Attribute: mode und color