2012-06-22 13 views
18

Ho un oggetto piuttosto grande che ho bisogno di passare a una funzione in uno script client. Ho provato a utilizzare JSON.stringify, ma ho riscontrato alcuni problemi con questo approccio, principalmente relativi alle prestazioni. È possibile fare qualcosa di simile in ejs?Passare un oggetto al client in node/express + ejs?

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

E nel mio script client, vorrei passare questo oggetto a una funzione in questo modo

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

Quando provo questo ho neanche

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

o

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

'JSON.stringify' è l'unico modo. –

risposta

8

Questo è il comportamento previsto. Il tuo motore di template sta provando a creare una stringa dal tuo oggetto che conduce a [Object object]. Se vuoi davvero passare dati del genere, penso che tu abbia fatto la cosa giusta, stringendo l'oggetto.

+1

'JSON.stringify (someLargeObj)' – alessioalex

48

In Node.js:

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

In EJS:

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

Potresti dirmi la differenza tra '<% -' e '<% ='? E perché no? Alla fine? – gr3g

+11

'<%= x %>' interpola il valore di x direttamente e '<%-x%>' anche HTML-lo scappa, quindi caratteri come '<' and '>' non vengono mangiati dal parser HTML. – prototype

+1

Nel punto di posta elettronica del terminale Javascript è facoltativo, ma probabilmente è meglio includerlo. – prototype

-1

che ci sia un modo molto migliore quando si passa un oggetto per i ejs, non avete a che fare con JSON. i metodi stringfy e JSON.parse, quelli sono un po 'complicati e confusi. Invece è possibile utilizzare il cui ciclo di viaggiare le chiavi di oggetti, ad esempio:

se si dispone di un oggetto come tale gerarchia

{ 
    "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" 
      } 
     ] 
    } 
} 

Sul lato EJS è possibile ciclo yourObject come questo;

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

Per questo esempio [tasto] può prendere 'indice', 'casa' e 'di' valori e sottochiave può essere qualsiasi di esso per bambini come 'url', 'path_to_layout', 'path_to_data'

1

Se si utilizzano i modelli, sarebbe molto meglio ottenere i valori nel modello, ad esempio se l'utente ha effettuato l'accesso o meno. È possibile ottenere i dati locali di invio utilizzando

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

Dal codice lato server, si inviano dati utente.

res.render('profile', { 
    user: user.loggedin, 
    title: "Title of page" 
}); 
Problemi correlati