Translations
Info
All page names need to be in English.
en da  de  fr  it  ja  km  nl  ru  zh

De:ViewHelper

From TYPO3Wiki
Jump to: navigation, search

fluid (Liste fluid)

Was sind ViewHelper

ViewHelper sind wie die damaligen Marker und Subparts Platzhalter in einem HTML-Template. Der Vorteil von ViewHelpern ist, dass diese in HTML-Notation als auch in einer Inlinenotation in das Template eingebunden werden können und dabei das HTML-Template immernoch valide halten.

Verfügbare ViewHelper

f:alias

Innerhalb diesen ViewHelpern könnt Ihr eigene Variablen zur Verfügung stellen. Es ist auch möglich tief verschachtelte Arrayeinträge oder Objekteigenschaften in kürzeren Variablen anzubieten.

Parameter Typ Benötigt Standard Erklärung
map Array Ja Der key des Arrays gibt den Namen der neuen Variable an.

Beispiel: neue Variable

XML / HTML:
<f:alias map="{vorname: 'Max', nachname: 'Mustermann'}">
 <p>Ich bin {vorname} {nachname}</p>
</f:alias>

Beispiel: Vorhandene Variablennamen verkürzen

XML / HTML:
<f:alias map="{handyChef: firma.chef.kontakt.handy}">
 <p>Rufnummer vom Chef ist: {handyChef}</p>
</f:alias>

f:base

Dieser ViewHelper erstellt einen BASE-Tag. Er gibt einen Standardpfad für alle Links auf Eurer Seite an. Da er im HEAD-Bereich Eurer Seite definiert werden muss, macht es nur dann Sinn diesen ViewHelper zu verwenden, wenn Ihr Fluid auch für die Seitentemplates verwendet.

XML / HTML:
<f:base />

f:cObject

Parameter Typ Benötigt Standard Erklärung
typoscriptObjectPath String Ja Gebt hier einen TypoScript Objektpfad an wie z.B. styles.content.get oder lib.meineEigeneTSKonfig
data Mixed Nein NULL Übergebt Ihr hier ein Array oder ein Objekt, dann könnt Ihr innerhalb Eures TS mit Hilfe von field auf die Arrayeinträge bzw. Objekteingenschaften zugreifen. Übergebt Ihr nur einen Text oder eine Zahl, dann wird dieser Wert über current zur Verfügung gestellt. Wir nichts übergeben, wird der Text zwischen den f:cObject-Tags verwendet.
currentValueKey String Nein NULL Wenn Ihr über data ein Array oder ein Objekt angegeben habt, dann könnt Ihr hier den Key des Arrays oder den Objektnamen eintragen, der der current-Eigenschaft zugewiesen werden soll. Achtung: Dieser Parameter ist erst seit 4.5 verfügbar. In früheren Version hieß er einfach nur current

Wenn Ihr mit den vorhandenen VIewHelpern mal nicht weiter kommt, dann könnt Ihr mit diesem ViewHelper auf die ganze Power von TypoScript zurückgreifen. Wrapped Inhalte, führt Objekteigenschaften zusammen, berechnet Werte, holt Euch Infos aus der Datenbank und natürlich noch viel mehr.

Beispiel

TS TypoScript:
lib.content < styles.content.get
XML / HTML:
<f:cObject typoscriptObjectPath="lib.content" />

Beispiel: Zugriff auf current

TS TypoScript:
lib.content = HTML
lib.content {
  value.current = 1
  value.wrap = <p>Das ist der Text zwischen den Tags<br />|</p>
}
XML / HTML:
<f:cObject typoscriptObjectPath="lib.content">
    Stefan heisst Euch willkommen
</f:cObject>

Beispiel: Zugriff auf field

TS TypoScript:
lib.content = COA
lib.content {
  10 = HTML
  10.value.current = 1
  10.value.wrap = <p>Nachname: |</p>
  20 = HTML
  20.value.dataWrap = Vollständiger Name: {field: vorname} {field: nachname}
}
XML / HTML:
<f:cObject typoscriptObjectPath="lib.content" data="{vorname: 'Stefan', nachname: 'Froemken'}" currentValueKey="nachname" />

f:comment

Alles was sich innerhalb dieser Tags befindet wird weder ausgeführt noch angezeigt. Ist schonmal sinnvoll, wenn Ihr mal was debuggen müsst.

Beispiel

In diesem Beispiel wird nur der letzte Satz "Stefan wohnt in Lindlar" ausgegeben. <f:alias map="{vorname: 'Stefan'}">

   <f:comment>

Dieser Text wird nicht angezeigt

Mein Name ist: {vorname}

   </f:comment>

{vorname} wohnt in Lindlar

</f:alias>

f:count

Dieser ViewHelper zählt die in einem Array enthaltenen Einträge

Parameter Typ Benötigt Standard Erklärung
subject Array Nein NULL Gebt das Array an, dessen Einträge gezählt werden sollen

Beispiel

XML / HTML:
<f:alias map="{mitarbeiter: {0: 'Stefan',1: 'Petra',2: 'Sascha'}}">
  <p>Bei uns arbeiten <f:count subject="{mitarbeiter}" /> Mitarbeiter</p>
</f:alias>

f:cycle

Dieser ViewHelper wird gerne in Verbindung mit dem f:for-ViewHelper verwendet um jeden x-ten Durchlauf ein besonderes Merkmal mitzugeben. So könnt Ihr z.B. sagen, dass jeder 3te Durchlauf fett dargestellt werden soll oder dass jeder 2te Durchlauf die zusätzliche CSS-Klasse odd erhält, um z.B. abwechselnde Hintergrundfarben pro Tabellenzeile zu erhalten.

Parameter Typ Benötigt Standard Erklärung
values Array Ja Gebt in Arraynotation an, welcher Wert bei welchem Durchlauf zugewiesen werden soll. Sind in der f:for-Schleife mehr Einträge als in diesem Array hier hinterlegt, wird nach Erreichen des letzten Eintrages wieder von vorne begonnen.
as String Ja Unter welchem Variablenamen soll der sich abwechselnde Wert im Template verfügbar gemacht werden?

Beispiel

Der erste Eintrag Stefan wird in der Schriftfarbe grün dargestellt. Der zweite Eintrag Petra in rot, der Dritte Sascha in blau und ab dem vierten Eintrag beginnt es wieder mit der Schriftfarbe grün und so weiter.

XML / HTML:
<f:alias map="{mitarbeiter: {0: {vorname: 'Stefan', stadt: 'Lindlar'},1: {vorname: 'Petra', stadt: 'Lindlar'},2: {vorname: 'Sascha', stadt: 'Remscheid'},3: {vorname: 'Patrick', stadt: 'Bonn'},4: {vorname: 'Sven', stadt: 'Gummersbach'},5: {vorname: 'Andrea', stadt: 'Wuppertal'}}}">
  <table cellpadding="5" cellspacing="0" border="2">
    <f:for each="{mitarbeiter}" as="kollege">
      <f:cycle values="{0: 'green', 1: 'red', 2: 'blue'}" as="color">
        <tr>
          <td style="color: {color}">{kollege.vorname}</td>
          <td style="color: {color}">{kollege.stadt}</td>
        </tr>
      </f:cycle>
    </f:for>
  </table>
</f:alias>

f:debug

Parameter Typ Benötigt Standard Erklärung
title String Nein NULL

Beispiel

XML / HTML:
<f:debug>{testVariables.array}</f:debug>

f:else

Beispiel siehe f:if-ViewHelper

f:escape

Deprecated: Bitte verwendet die f:format.* ViewHelper.

f:flash

Parameter Typ Benötigt Standard Erklärung
renderMode String Nein ul Als Alternative kann auch div angegeben werden

Beispiel

XML / HTML:
<f:flashMessages renderMode="div" />

f:form

Parameter Typ Benötigt Standard Erklärung
action String Nein NULL
arguments Array Nein array()
controller String Nein NULL
extensionName String Nein NULL
pluginName String Nein NULL
pageUid Integer Nein NULL
object Mixed Nein NULL
pageType Integer Nein 0
noCache Boolean Nein FALSE
noCacheHash Boolean Nein FALSE
section String Nein
format String Nein
additionalParams Array Nein array()
absolute Boolean Nein FALSE
addQueryString Boolean Nein FALSE
argumentsToBeExcludedFromQueryString Array Nein array()
fieldNamePrefix String Nein NULL
actionUri String Nein NULL
objectName String Nein NULL

Beispiel

XML / HTML:
<f:form action="...">...</f:form>

f:for

Parameter Typ Benötigt Standard Erklärung
each Array Ja
as String Ja
key String Nein
reverse Boolean Nein FALSE
iteration String Nein NULL

Beispiel

XML / HTML:
<f:alias map="{mitarbeiter: {0: {vorname: 'Stefan', stadt: 'Lindlar'},1: {vorname: 'Petra', stadt: 'Lindlar'},2: {vorname: 'Sascha', stadt: 'Remscheid'},3: {vorname: 'Patrick', stadt: 'Bonn'},4: {vorname: 'Sven', stadt: 'Gummersbach'},5: {vorname: 'Andrea', stadt: 'Wuppertal'}}}">
  <table cellpadding="5" cellspacing="0" border="2">
    <f:for each="{mitarbeiter}" as="kollege">
      <tr>
        <td>{kollege.vorname}</td>
        <td>{kollege.stadt}</td>
      </tr>
    </f:for>
  </table>
</f:alias>

f:groupedFor

Parameter Typ Benötigt Standard Erklärung
each Array Ja
as String Ja
groupBy String Ja
groupKey String Nein groupKey

Beispiel

XML / HTML:
<f:alias map="{mitarbeiter: {0: {vorname: 'Stefan', stadt: 'Lindlar'},1: {vorname: 'Petra', stadt: 'Lindlar'},2: {vorname: 'Sascha', stadt: 'Remscheid'},3: {vorname: 'Patrick', stadt: 'Bonn'},4: {vorname: 'Sven', stadt: 'Gummersbach'},5: {vorname: 'Andrea', stadt: 'Wuppertal'}}}">
  <table cellpadding="5" cellspacing="0" border="2">
    <f:groupedFor each="{mitarbeiter}" as="kollegen" groupBy="stadt" groupKey="stadt">
      <tr>
        <th colspan="2">{stadt}</th>
      </tr>
      <f:for each="{kollegen}" as="kollege">
        <tr>
          <td style="color: {color}">{kollege.vorname}</td>
          <td style="color: {color}">{kollege.stadt}</td>
        </tr>
      </f:for>
    </f:groupedFor>
  </table>
</f:alias>

f:if

Parameter Typ Benötigt Standard Erklärung
condition Boolean Ja

Beispiel

XML / HTML:
<f:if condition="{rank} > 100">
  Will be shown if rank is > 100
</f:if>

f:image

Parameter Typ Benötigt Standard Erklärung
src String Ja
width String Nein NULL
height String Nein NULL
minWidth Integer Nein NULL
minHeight Integer Nein NULL
maxWidth Integer Nein NULL
maxHeight Integer Nein NULL

Beispiel

XML / HTML:
<f:image src="EXT:myext/Resources/Public/typo3_logo.png" alt="alt text" />

f:layout

Beispiel

XML / HTML:
<f:layout name="main" />

f:renderChildren

Dieser ViewHelper kann nur innerhalb eines Templates verwendet werden, das einem Widget Controller zugehörig ist.

Parameter Typ Benötigt Standard Erklärung
arguments Array Nein array()

f:renderFlashMessages

Deprecated: Bitte verwendet stattdessen den f:flashMessages-ViewHelper

f:render

Parameter Typ Benötigt Standard Erklärung
section String Nein NULL
partial String Nein NULL
arguments Array Nein array()
optional Boolean Nein FALSE

Beispiel

XML / HTML:
<f:section name="someSection">This is a section. {foo}</f:section>
<f:render section="someSection" arguments="{foo: someVariable}" />

f:section

Beispiel

XML / HTML:
<f:section name="someSection">This is a section. {foo}</f:section>
<f:render section="someSection" arguments="{foo: someVariable}" />

f:then

Beispiele im f:if-ViewHelper

f:translate

Parameter Typ Benötigt Standard Erklärung
key String Ja
default String Nein NULL
htmlEscape Boolean Nein TRUE
arguments Array Nein NULL

Beispiel

XML / HTML:
<f:translate key="htmlKey" htmlEscape="false" />