I have a nice tight array that would render nicely into a jade partial if I could only pass it over to the partial once it was done assembling itself. (I've confirmed it does by preloading it)
The problem I have now and can't find the answer anywhere is that when I run my app I can't use or display the array until it is done assembling/loading itself..(its being populated with scraped data) -So I'm using async to run the functions that build the array. Works great. -I'm then calling a function done() once the whole thing is built where I confirm it is indeed built -And now I just want to pass the array over to my partial but seems I can't do it unless using Ajax + JSON :( of which I'm trying to avoid since the partial already has solid iteration built in.
-Does anybody know of an easy way to populate the partial after the app is already running (without using sockets)?
//in my main app, web.js
//assume I have all the dependencies loaded
//setup an empty array
var items = new Array();
// then run 'fetch' which populates array with scraped data, takes about 10 seconds
app.get('/', function(req, res){
fetch(p.u[0]); //builds the array, returns items[]
res.render('index.jade', {
title: 'my first node.js app',
item: 'items' //what the partial needs, this throws an error if I don't
})
});
//have to use this to avoid initial error due to array being empty/undefined when app
//first starts
var params = {
"namespace": {
"items": [
"an unnecessary value"
]
}
};
//and finally this is what's called once the array is finished assembling itself
function displayItems(){
app.get('/', function(req, res){
req.render('items.jade', {item : 'items'})
})
}
//index.jade
//setup my partial
//script is there to avoid initial error due to array being empty/undefined when app
//first starts
div.list
script
if(namespace.items) {
if(namespace.items.length) {
!= partial('item', items)
}
}
//and my partial, _items.jade
//express docs confirm that jade would iterate over each item in the items array
//with this jade markup
ul.list
li.date #{item.date}
li.descrip #{item.descrip}
li.reas #{item.reas}
li.cmpny #{item.cmpny}
li.photo #{item.photo}
it's late, i'm not entirely certain I understood your question, but if you are willing to wait 10 secs once, you could do it like this and just cache the result:
var items = null;
app.get('/', function(req, res){
function done(){
res.render('index.jade', {
title: 'my first node.js app',
item: items
}):
}
if( items == null ){
return fetch(p.u[0], function(err,fetchedItems){
if( err ) throw err;
items = fetchedItems;
return done();
});
}
return done();
});
hope this helps.
or maybe not: you are using jade on the server-side to assemble pages BEFORE they are sent across the wire.
If I understand correctly, you would like to display a page to the user and after 10 secs show the results (items) on that same page without reloading. Without using Sockets or Ajax, there is no way I know of to accomplish this.
You can either wait until the data is ready, or show a page, saying that the data is loading currently, then switch it out.
partials are page-fragments, or html snippets, that can be included in a .jade like so !=partial(template name[, options]) or called from express like so: res.partial(template name[, options]);. All of this happens on the server.
If you're trying to do this synchronously than you're defeating the whole idea behind node.js and Express. If your app is waiting for the query / script that generates this array than what's going to happen to next http requests? You should restructure your app to take advantage of node's ansync approach and pass render as a callback:
app.get('/', function(req, res){
var renderView = function(items) {
return res.render('index.jade', {
title: 'my first node.js app',
item: items
})
};
fetch(p.u[0], renderView);
});
And you have to modify fetch() to accept 2nd param (the callback), which you will have to call with the items object.