Hiển thị một biến dưới dạng HTML trong EJS


97

Tôi đang sử dụng thư viện Biểu mẫu cho Node.js ( Biểu mẫu ), thư viện này sẽ hiển thị biểu mẫu cho tôi trên chương trình phụ trợ như sau:

var signup_form = forms.create({
    username: fields.string({required: true})
    , password: fields.password({required: true})
    , confirm:  fields.password({
        required: true
        , validators: [validators.matchField('password')]
    })
    , email: fields.email()
});
var signup_form_as_html = signup_form.toHTML();

Dòng cuối cùng var signup_var signup_form_as_html = signup_form.toHTML();tạo ra một khối HTML trông như sau:

<div class="field required"><label for="id_username">Username</label><input type="text" name="username" id="id_username" /></div><div class="field required"><label for="id_password">Password</label><input type="password" name="password" id="id_password" /></div><div class="field required"><label for="id_confirm">Confirm</label><input type="password" name="confirm" id="id_confirm" /></div><div class="field"><label for="id_email">Email</label><input type="text" name="email" id="id_email" /></div>

Về cơ bản chỉ là một chuỗi HTML dài. Sau đó, tôi cố gắng kết xuất nó bằng EJS và Express bằng mã sau:

res.render('signup.ejs', {
    session: loginStatus(req)
    , form: signup_form_as_html
});

Nhưng khi kết xuất HTML chỉ đơn giản là chuỗi mà tôi đã đăng ở trên, chứ không phải là HTML thực tế (và do đó là một biểu mẫu như tôi muốn). Có cách nào để làm cho chuỗi đó hiển thị như HTML thực sự bằng cách sử dụng EJS không? Hay tôi sẽ phải sử dụng thứ gì đó giống như Ngọc?

Câu trả lời:


293

Với EJS, bạn có thể có một số thẻ:

<% code %>

... là mã được đánh giá nhưng không được in ra.

<%= code %>

... là mã được đánh giá và in ra (thoát).

<%- code %>

... là mã được đánh giá và in ra (không thoát).

Vì bạn muốn in biến của mình và KHÔNG thoát khỏi nó, mã của bạn sẽ là loại cuối cùng (với <%-). Trong trường hợp của bạn:

<%- my_form_content %>

Để biết thêm các thẻ khác, hãy xem toàn bộ tài liệu EJS


7
props dude bravo đã khắc phục sự cố của tôi ngay lập tức
cbsm1th

chỉ dành hàng giờ để tìm cách làm điều đó cho đến khi tôi tìm thấy bài đăng này. Cám ơn rất nhiều !!!
Sam

Tốt, bạn đã cứu ngày của tôi.
Afshin Mehrabani

Đang sử dụng mô-đun chính xác được hỏi ở đây. Vì vậy, khá may mắn :) Cảm ơn
majidarif

Những gì có thể được sử dụng để thoát khỏi cả ký tự "(dấu phẩy ngược)?
Victor

15

Cập nhật tháng 10 năm 2017

Các EJS mới (v2, v2.5.7) phát triển đang diễn ra ở đây: https://github.com/mde/ejs các EJS cũ (v0.5.x, 0.8.5, v1.0.0) có sẵn ở đây https: / /github.com/tj/ejs

Giờ đây với ejs bạn có thể làm được nhiều hơn thế. Bạn có thể dùng:

  • Đầu ra đã thoát với <%= %>(có thể định cấu hình chức năng thoát)
  • Đầu ra thô không thoát với <%- %>
  • Chế độ newline-trim ('newline slurping') với -%>thẻ kết thúc
  • Chế độ cắt bỏ khoảng trắng (bỏ qua tất cả khoảng trắng) để kiểm soát luồng với <%_ _%>
  • Kiểm soát dòng chảy với <% %>

Vì vậy, trong trường hợp của bạn, nó sẽ <%- variable %>ở đâu variablegiống như

var variable = "text here <br> and some more text here";

Tôi hi vọng điêu nay se giup được ai đo. 🙂


3

Tôi đã gặp vấn đề tương tự với việc hiển thị đầu vào textarea từ trình soạn thảo wysiwyg được lưu dưới dạng html trong cơ sở dữ liệu của tôi. Trình duyệt sẽ không hiển thị nó nhưng hiển thị html dưới dạng văn bản. Sau nhiều giờ tìm kiếm, tôi phát hiện ra

<%= data %> thoát dữ liệu trong khi

<%- data %>còn lại dữ liệu 'thô' (không thoát) và trình duyệt hiện có thể hiển thị nó.

Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.