Expression Option Sightless

Question

Ich schaute über den Ausdruck Optionen in sightly verwendet. Ich habe versucht, die untere Zeile des Codes, aber es scheint nur den Text über die Seite zu rendern, kann jemand die Verwendung von Optionen mit einigen guten Beispielen zur Verfügung stellen.

${'Assets' @ i18n, locale='fr-CH', hint='Translation Hint'} 
    ${'Page {0} of {1}' @ format = [count,total] } 

Ich habe versucht, und den Code unten verstehen, die Parsys

<div data-sly-resource ="${@path='question_list', resourceType='wcm/foundation/components/parsys'}"></div> 

auch einschließen, von wo aus ich die ganze Liste von Daten-sly- [Elemente] erhalten können.

Dank

Answer 1

Optionen in Sightly Ausdrücke können zwei verschiedene Arten der Nutzung haben:

1. Sie können als Anweisungen handeln, die die Ausgabe eines Ausdrucks, wie eine Funktion würde verarbeiten.
2. Wenn der Ausdruck in einer Anweisung data-sly-* enthalten ist, können Anweisungen oder Parameter für diese Anweisung bereitgestellt werden.

Hinweis: leicht auf die unten bereitgestellten Beispiele ausprobieren, können Sie die REPL tool auf AEM Instanz installieren.

auf einem einfachen Ausdruck (das nicht in einer data-sly-* Aussage befindet), sind folgende Optionen möglich:

• format: Verkettet Saiten.
  Beispiel: ${'Page {0} of {1}' @ format = [1, 10]}
  Displays: Page 1 of 10
• i18n: Saiten Verschiebt. Darüber hinaus ermöglicht locale, die Sprache zu ändern, wenn etwas anderes als die aktuelle Seitensprache genommen werden soll, und hint ermöglicht, dem Übersetzer Hilfe zu bieten und Zeichenfolgen zu unterscheiden, die zwar identisch sind, aber unterschiedliche Bedeutungen haben.
  Beispiel: ${'Number' @ i18n, locale = 'de', hint = 'Media DPS Folio Number'}
  Displays: Nummer
• join: Definiert den String-Begrenzer zwischen Elementen eines Arrays anzuzeigen.
  Beispiel: ${['foo', 'bar'] @ join = '-'}
  Displays: foo-bar
• context: Kontrolle, wie die HTML entkommen und XSS Schutz gilt.
  Beispiel: ${'<p>Hi!</p><script>alert("hack!")</script>' @ context = 'html'}
  Displays: <p>Hi!</p>

Nach Aussagen erlauben, die Expression Optionen wie oben aufgeführt, da diese Aussagen den Ausdruck zu schreiben, ohne Anweisung ähnlich sind:

• data-sly-text:
  Dieses Beispiel: <p data-sly-text="${currentPage.title}">Lorem ipsum</p>
  entspricht: <p>${currentPage.title}</p>
  (Dies kann nützlich sein, wenn Sie mit dem HTML-Designer im Markup versehen Platzhalter verlassen wollen.)
  So dieses Beispiel: <p data-sly-text="${'Page {0} of {1}' @ format = [1, 10]}"></p>
  Displays: <p>Page 1 of 10</p>
• data-sly-attribute:
  Dieses Beispiel: <p href="#" data-sly-attribute.href="${currentPage.path}"></p>
  Entspricht: <p href="${currentPage.path}"></p>
  (Dies kann nützlich sein, um gültiges HTML zu schreiben, da der HTML5-Validator von W3C überprüft, ob URLs korrekt erstellt wurden. Auch ermöglicht es Platzhalter durch den HTML-Designer im Markup versehen lassen)
  So dieses Beispiel:. <p data-sly-attribute.title="${['foo', 'bar'] @ join = '-'}"></p>
  Displays: <p title="foo-bar"></p>
  Beachten Sie, dass Daten-sly-Attribut kann auch mehrere Attribute eingestellt werden, indem ein iterable Schlüssels -Wert Objekt, wie im Beispiel unten. Aber diese Nutzung von Daten-sly-Attribut erlaubt keine Optionen zu verwenden: <div data-sly-attribute="${properties}"></div>

Nach Aussagen keine Ausdrucksmöglichkeiten akzeptieren, wie sie erlauben benannte Parameter übergeben:

• data-sly-use:
  Beispiel: <p data-sly-use.bar="${'logic.js' @ foo = 'hello'}">${bar}</p>
  logic.js: use(function() { return this.foo + " world"; });
  Displays: <p>hello world</p>
• data-sly-template and data-sly-call:
  Beispiel:
  <template data-sly-template.tmpl="${@ foo}">${foo} world</template>
<p data-sly-call="${tmpl @ foo = 'hello'}"></p>
  Displays: <p>hello world</p>

Nach Aussagen erlauben eine benutzerdefinierte Liste der Optionen:

• data-sly-include:Hinweis dass: <div data-sly-include="${ @ path = 'path/to/template.html'}"></div>
  entspricht: <div data-sly-include="${'path/to/template.html'}"></div>
  Oder sogar: <div data-sly-include="path/to/template.html"></div>
  (ich immer für die kürzere Schreibform entscheiden würde.)
  Optionen für Daten-sly-umfassen (außer path) sind:
  • prependPath: etwas vor dem Pfad hinzu.
  • appendPath: Fügt etwas nach dem Weg.
  • wcmmode: Ändert die WCM mode für die Datei enthalten.
• data-sly-resource:
  Auch hier ist die kurze Schreibform: <div data-sly-resource="par"></div>
  Gleiche wie für data-sly-include, aber es übernimmt zusätzlich folgende Optionen:
  • Selektoren: die Wähler zu ersetzen.
  • addSelectors: Selektoren hinzuzufügen.
  • removeSelectors: Um Selektoren zu entfernen.
  • resourceType: Um den Ressourcentyp zu definieren oder zu ändern (wird nur benötigt, wenn er nicht bereits auf dem Inhaltsknoten definiert ist).
  • und cssClassName: Für Abwärtskompatibilität mit der Art, wie AEM DIV-Elemente um enthaltene Komponenten in JSP hinzugefügt hat.

Und folgende Aussagen erlauben keine Ausdrucksmöglichkeiten:

• data-sly-test
• data-sly-list
• data-sly-unwrap
• data-sly-element