2012-06-22 24 views
18

Tôi có một đối tượng khá lớn mà tôi cần phải chuyển đến một hàm trong một kịch bản khách hàng. Tôi đã thử sử dụng JSON.stringify, nhưng đã gặp phải một số vấn đề với cách tiếp cận này - chủ yếu là hiệu suất liên quan. Có thể làm một cái gì đó như thế này trong ejs?Chuyển đối tượng cho khách hàng trong nút/express + ejs?

app.get('/load', function(req, res) { 
    var data = { 
     layout:'interview/load', 
     locals: { 
      interview: '', 
      data: someLargeObj 
     } 
    }; 
    res.render('load', data); 
}); 

Và trong kịch bản khách hàng của tôi, tôi sẽ vượt qua đối tượng này đến một chức năng như vậy

<script type="text/javascript"> 
    load(<%- data %>); // load is a function in a client script 
</script> 

Khi tôi cố gắng này tôi nhận được một trong hai

<script type="text/javascript"> 
    load(); 
</script> 

hoặc

<script type="text/javascript"> 
    load([Object object]); 
</script> 
+0

'JSON.stringify' là cách duy nhất. –

Trả lời

8

Đó là hành vi mong đợi. Công cụ tạo mẫu của bạn đang cố gắng tạo chuỗi từ đối tượng dẫn đến [Đối tượng đối tượng]. Nếu bạn thực sự muốn truyền dữ liệu như vậy, tôi nghĩ bạn đã làm đúng việc bằng cách xâu chuỗi đối tượng.

+1

'JSON.stringify (someLargeObj)' – alessioalex

48

Trong Node.js:

res.render('mytemplate', {data: myobject});

Trong EJS:

<script type='text/javascript'> 
    var rows =<%-JSON.stringify(data)%> 
</script> 
+3

Bạn có thể cho tôi biết sự khác biệt giữa '<% -' và '<% =' không? Và tại sao không có ';' ở cuối? – gr3g

+11

'<%= x %>' nội suy giá trị của x trực tiếp và '<%-x%>' cũng HTML-thoát nó, vì vậy các ký tự như '<' and '>' không được ăn bởi trình phân tích HTML. – prototype

+1

Trong dấu chấm phẩy thiết bị đầu cuối Javascript là tùy chọn, nhưng có lẽ tốt hơn để bao gồm mặc dù. – prototype

-1

nghĩ có một cách tốt hơn nhiều khi đi qua một đối tượng đến EJS, bạn không phải đối phó với JSON. các phương thức stringfy và JSON.parse, các phương thức này hơi phức tạp và khó hiểu. Thay vào đó bạn có thể sử dụng cho trong vòng lặp để đi du lịch các phím của các đối tượng của bạn, ví dụ:

nếu bạn có một đối tượng như hệ thống cấp bậc như vậy

{ 
    "index": { 
     "url": "/", 
     "path_to_layout": "views/index.ejs", 
     "path_to_data": [ 
      "data/global.json", 
      { 
       "data/meta.json": "default" 
      } 
     ] 
    }, 
    "home": { 
     "url": "/home", 
     "path_to_layout": "views/home/index.ejs", 
     "path_to_data": [ 
      "data/global.json", 
      { 
       "data/meta.json": "home" 
      } 
     ] 
    }, 
    "about": { 
     "url": "/about", 
     "path_to_layout": "views/default.ejs", 
     "path_to_data": [ 
      "data/global.json", 
      { 
       "data/meta.json": "about" 
      } 
     ] 
    } 
} 

Về phía EJS bạn có thể lặp yourObject như thế này;

<% if (locals.yourObject) { %> 
    <% for(key in yourObject) { %> 
    <% if(yourObject.hasOwnProperty(key)) { %> 
     <div> <a class="pagelist" href="<%= yourObject[key]['subkey'] %>"><%= key %></a></div> 
    <% } %> 
    <% } %> 
<% } %> 

Ví dụ này [key] có thể mất 'index', 'nhà' và 'về' giá trị và khóa có thể là bất kỳ đó là trẻ em như 'url', 'path_to_layout', 'path_to_data'

1

Nếu bạn đang sử dụng templating, sau đó nó sẽ là tốt hơn để có được các giá trị trong mẫu, ví dụ cho dù người dùng đăng nhập hay không. Bạn có thể gửi dữ liệu cục bộ bằng cách sử dụng

<script> 
    window.user = <%- JSON.stringify(user || null) %> 
</script> 

Từ mã phía máy chủ, bạn đang gửi dữ liệu người dùng.

res.render('profile', { 
    user: user.loggedin, 
    title: "Title of page" 
}); 
Các vấn đề liên quan