2016-07-17 4 views
6

Ich spiele mit Node und Express herum und benutze die Template-Engine für Mops (früher Jade), um meinen HTML-Code zu rendern. Alles hat gut funktioniert, bis ich begann, Variablen in die href meiner Anker-Links zu injizieren. Was komisch ist, ist, dass wenn ich meine Express-App view engine zu jade ändere, dann die Dinge wie erwartet funktionieren.Mops (ehemals Jade) Variablen funktionieren nicht richtig (Interpolation) Korrekt im Anker Href

Basierend auf other articles Ich habe gelesen, das Problem scheint ein Interpolationsproblem zu sein, aber ich kann nicht scheinen, eine Ressource oder Dokumentation zu finden, die zeigt, wie dieses Problem richtig zu beheben.

Ex.

Ich ziehe Daten aus einem rooms JSON-Array und dann mit einer for Schleife Schleife durch jedes Array-Element und die Daten für jeden Raum ausgeben. Mit jade funktioniert das folgende.

table.table.table-striped 
    thead 
    tr 
     th Name 
     th Id 
    tbody 
    each room in rooms 
     tr 
     td(style="width: 50px;") 
      a(href!="/admin/rooms/delete/#{room.id}") Delete 
     td #{allTitleCase(room.name)} 
     td #{room.id} 

Mit pug funktioniert das oben genannte NICHT richtig. Insbesondere funktioniert die Verknüpfung a(href='/admin/rooms/delete/#{room.id}') Delete nicht richtig. Anstatt die Raum-ID in den Link href zu injizieren, gibt es im wahrsten Sinne des Wortes # {room.id} als Endteil die href-Verbindung aus.

Irgendwelche Ideen, wie man dies in pug beheben kann?

Beachten Sie, dass ich alle folgenden Schritte mit pug ausprobiert habe, aber keine dieser Optionen hat funktioniert.

  • a(href="/admin/rooms/delete/#{room.id}") Delete
  • a(href!="/admin/rooms/delete/#{room.id}") Delete

Antwort

11

UPDATE: Pug 2.0 eingeführt brechen Änderungen wie Interpolation behandelt wird.

Basierend auf the changelog, eine der folgenden sollte Arbeit:

// to solve OP's problem, the following can be used: 
a(href="/admin/rooms/delete/" + room.id) Delete 

// Here are a few additional scenarios which use the new API 
// for anyone stumbling across this answer in the future 
- var href = "/admin/rooms/delete/" + room.id; 
a(href=href) 
a(href=`${href}`) // Node.js/io.js ≥ 1.0.0 
a(href=href + '?foo=bar') 
+0

Danke für die Hilfe, leider für mich nicht funktioniert hat. Während es auf der Jade-Lang-Website funktionierte, scheint es nicht in meiner Express-App zu funktionieren, die "Mops" als "View-Engine" ausführt. Ich denke, es hat auf der Jade-Lang-Website funktioniert, weil es tatsächlich 'Jade' und nicht' Mops' verwendet. – Corey

+1

Haben Sie [das Pug 2.0 Changelog] gelesen (https://github.com/pugjs/pug/issues/2305)? – pdoherty926

+0

Nachdem ich das Changelog wie Sie vorgeschlagen hatte, fand ich es heraus ... Ich änderte den Ankerlink zu 'a (href ="/admin/rooms/delete/"+ room.id) Löschen" und das funktionierte. Danke für die Hilfe, ich weiß es zu schätzen. Können Sie Ihre Antwort so bearbeiten, dass sie den richtigen Code enthält? Wenn ja, werde ich weitermachen und Ihre Antwort richtig markieren. – Corey

Verwandte Themen