2013-12-16 34 views
1

我正在使用Node.js和Jade模板引擎来创建测试网页,以确认某些功能可以在真实项目中使用。Node.js Jade:向表中添加行

根据客户端的IP地址的第一位数字,我想呈现一个带有表格的Jade页面。表格中的行数等于先前的第一位数字。例如,如果客户的地址是192.198.94.227,表格将有1行。如果是92.61.131.242,表格将有9行。

我知道这听起来很愚蠢,但我只使用它来测试我是否可以为我的真实网站添加不同数量的表格行。

有没有什么方法可以用Jade或Node.js代码来表示呢? 或者如果我不能这样做,是否有任何解决方法?

+0

http://jade-lang.com/reference/ jade support javascript, - for(var i = 0; i damphat

回答

0

其实,Jade只是一个模板引擎。正确的解决方案是使用JavaScript来修改DOM(文档对象模型)。想想Jade只是显示数据的结构。但在这之前,您需要先处理这些数据。使用Node.js来收集一些必要的信息,然后使用JavaScript(jQuery,AngularJS等)来操纵HTML模板中的DOM(使用Jade)。

0

当您使用Jade模板渲染页面时,可以为模板提供一组变量。

这是处理'/ example'请求的示例性快速方法。

req.render的第一个参数指定模板名称,第二个参数(一个对象)指定模板参数。在这种情况下,有两个参数:ip(客户IP)和ipFirstDigit - 客户IP地址的第一位数字。

function remoteAddr(req) { 
    if (req.ip) { 
     return req.ip; 
    } 
    var socket = req.socket; 
    if (socket.socket) { 
     return socket.socket.remoteAddress; 
    } 
    return socket.remoteAddress; 
}; 

app.get('/example', function(req, res){ 
    var ip = remoteAddr(req); 
    res.render('index', { ip: ip, ipFirstDigit:ip.charAt(0) }); 
}); 

玉模板可以看起来如下:

p Customer IP: #{ip} 
    p Customer IP first digit: #{ipFirstDigit} 

    table 
    - for (var i = 0; i < ipFirstDigit; i++) 
     tr 
     td #{i+1} 

前两行显示客户的IP和客户IP的第一位。然后根据客户IP值的第一位呈现表格。

输出,用于IP:92.61.131.242如下:

<p>Customer IP: 92.61.131.242</p> 
<p>Customer IP first digit: 9</p> 
<table> 
    <tbody> 
    <tr><td>1</td></tr> 
    <tr><td>2</td></tr> 
    <tr><td>3</td></tr> 
    <tr><td>4</td></tr> 
    <tr><td>5</td></tr> 
    <tr><td>6</td></tr> 
    <tr><td>7</td></tr> 
    <tr><td>8</td></tr> 
    <tr><td>9</td></tr> 
    </tbody> 
</table> 

我希望将你的原型帮助。