如何將數據從db注入到jade模板中？

我試圖從mongodb導入數據到玉模板，以便在圖中顯示它們。我正在使用chart.js內嵌腳本，以便在圖形上呈現數據。因此，從MongoDB的數據是在頁面上，我可以這樣訪問：如何將數據從db注入到jade模板中？

each city in cities 
    p #{city.name}

這裏是我如何將數據傳遞給頁：

exports.index = function(req,res){ 
    var cities = City.find({}).limit(20); 
    cities.exec(function(err,doc) { 
     res.render("index",{cities:doc}); 
    }); 
};

我創建相同的應用程序與PHP，通過簡單地將數據傳遞到頁和注入數據到JavaScript圖（與json_encode）

Here is final result with php:

這很容易，因爲php數據是HTML頁面的全局數據。如何用Jade？

感謝

來源

2014-03-05 carousel

啊，所以你的目標是既使用城市數據在服務器上生成HTML也讓它在瀏覽器中的原始JavaScript對象可用數據。爲此，請將其格式化爲JSON並將其填充到<script>標記中。有模塊，以幫助這個如sharify，但在你的玉模板的基本思路做這樣的事情：

在您的明確路由處理的javascript：

exports.index = function(req,res){ 
    var cities = City.find({}).limit(20); 
    cities.exec(function(err,doc) { 
     //There are tricky rules about safely embedding JSON within HTML 
     //see http://stackoverflow.com/a/4180424/266795 
     var encodedCityData = 'window.cities = ' + JSON.stringify(cities) 
      .replace(/</g, '\\u003c') 
      .replace(/-->/g, '--\\>'); 
     res.render("index",{cities:doc, encodedCityData: encodedCityData}); 
    }); 
};

在你的玉模板：

script!= encodedCityData

在瀏覽器中，您可以通過已設置到window對象上的cities變量訪問數據。

來源

2014-03-05 16:48:01

謝謝你的回答 - 我沒有通過數據 - 看到我更新的問題。 – carousel

很好 - 我對json和php有同樣的問題。同時我發現用ajax獲取數據要容易得多，因爲我正在使用js數據。 – carousel

如何將數據從db注入到jade模板中？

回答

相關問題