2012-12-20 7 views
16

Ich mag eine CSS-Klasse zu einem Teil von HTML zuweisen basierend auf Zustand in slim-langslim-lang die if-else verschachtelter Code

Ich tue die folgenden

- if current_user 
    .title 
- else 
    .title_else 

Nun, wie kann ich schreibe den HTML-Code, der in der oben genannten Klasse verschachtelt werden soll? Muss ich HTML in den beiden if Zustand und else Zustand schreiben?

Der Grund ist, dass der HTML-Code, der in einer der obigen Klassen verschachtelt werden sollte, weiter nach rechts gerichtet sein sollte. Aber wenn ich es weiter vorschlage, ist es auch unter sonst Bedingung. Wie gehe ich jetzt damit um?

Antwort

28

Hier ist ein Motto:

.thing class=(current_user ? 'large-menu' : 'medium-menu') 
    h4 Same content, different class 
+3

Sehr schön. Interpolation ist nicht erforderlich. '.thing class = (richtig? 'großes Menü': 'mittleres Menü')' – obfk

2

1) Ja, Sie müssen HTML in beide erstellten divs schreiben, da Sie möchten, dass es anders ist. Wenn Sie nicht möchten, dass es anders ist, brauchen Sie keine if Aussage!

2) Ich Ihren Punkt nicht wirklich verstehen, aber dieser Code funktioniert bei mir völlig in Ordnung:

- if true 
    .title 
    h4 True is true! 
- else 
    .title_else 
    h4 True is not true! 

Dieser Code ein div mit einer Klasse von .title und h4 mit dem Text True is true! Inneren zeigte .

EDIT: Okay, jetzt sehe ich, was du meinst! Es ist NICHT möglich, etwas so zu tun, weil es das h4 nicht überträgt!

- if true 
    .title 
- else 
    .title_else 

    h4 Same content, different class 

Ich würde Ihnen empfehlen, einen Helfer zu schreiben, die Sie partials zu machen und dann machen genau das teilweise von innen beiden Bedingungen ermöglicht. Das bedeutet, dass Sie nur diesen einen Teil schreiben und ihn zweimal aufrufen müssen.

- if true 
    .title 
    = render 'footer' 
- else 
    .title_else 
    = render 'footer' 
+0

mein Frage Ich habe den gleichen Block von Code für beide, wenn Block und sonst blockieren. Ich möchte nur eine andere Klasse basierend auf der Bedingung anwenden. Gibt es einen besseren Weg, die Wiederholung von Code zu vermeiden? – nik7

15

Da Sie gerade zwischen zwei Attributen Makeln, Tiago Franco's answer für Ihre Zwecke sicherlich ausreichend ist. Es gibt jedoch einen anderen Weg, der sich als nützlich erweist.

Sie können capture verwenden, um HTML in eine lokale Variable zu rendern und diesen Inhalt dann in die gewünschte Kontrollstruktur einzubetten. Also, wenn Ihr Verpackungsinhalt etwas komplexer war, würden Sie dies tun:

- shared_content = capture do 
    div This is displayed regardless of the wrapper 
- if current_user 
    | You're logged in! 
    .title 
    = shared_content 
- else 
    | You're not logged in! 
    .title_else 
    = shared_content 

Ich werde oft diese verwenden, um Inhalte in einem Link zu wickeln, wenn es eine URL zur Verfügung:

- image = capture do 
    img src=image_url 
- if url.blank? 
    = image 
- else 
    a href=url = image