pug | 易学教程

How do I put a html tag conditional in jade?

阅读更多关于 How do I put a html tag conditional in jade?

问题 In jade, I want to put in a html tag conditional as per this method, which puts in      <html class="">  at the top of a html file. I tried //[if lt IE 7]> <html class="no-js ie6 oldie" lang="en"> <![endif] //[if IE 7]> <html class="no-js ie7 oldie" lang="en">

Jade indentation errors

阅读更多关于 Jade indentation errors

问题 So for my Express site, I'm using jade. So I decided to try modifying my layout file so I can start designing my site. I modified the original layout code (which worked), but I started getting indentation errors in any file that extends layout like this: 500 Error: /home/kevin/Blue/views/layout.jade:6 4| p Hello World Invalid indentation, you can use tabs or spaces but not both 4| p Hello World Invalid indentation, you can use tabs or spaces but not both at Object.Lexer.indent (/home/kevin

How do I display todays date in Node.js Jade?

阅读更多关于 How do I display todays date in Node.js Jade?

问题 I am new to Node.js and Jade and I have tried to use #{Date.now()} and it's giving me numbers. How do I display the date in mm/dd/yy format? 回答1: You can use moment.js First, add moment to your express application locals express = require('express'); ... app = express(); app.locals.moment = require('moment'); Then you can use moment within a jade template like this: p #{moment(Date.now()).format('MM/DD/YYYY')} Moment takes Date.now() by default, so yo can also write: p #{moment().format('MM

Pass variables to base layout from extending pug/jade template

阅读更多关于 Pass variables to base layout from extending pug/jade template

I would like to set a class on the body tag by declaring a variable in a template that extends a base layout. When I try, the body_class variable is undefined in the layout. It appears the layout is executed before the extending template, or they are executed in different scopes or something. Is there another way? Would a mixin work here? _layout.jade: doctype html html(lang="en-au") head meta(charset="utf-8") block css body(class=(body_class || "it-did-not-work")) block header block content block footer home.jade: var body_class = 'i-am-the-home-page' extends _layout block header h1 home Ah

Render Image Stored in Mongo (GridFS) with Node + Jade + Express

阅读更多关于 Render Image Stored in Mongo (GridFS) with Node + Jade + Express

问题 I have a small .png file stored in Mongo using GridFS. I would like to display the image in my web browser using Node + Express + Jade. I can retrieve the image fine e.g.: FileRepository.prototype.getFile = function(callback,id) { this.gs = new GridStore(this.db,id, 'r'); this.gs.open(callback); }; but I don't know how to render it using the Jade View Engine. There doesn't seem to be any information in the documentation. Can anyone point me in the right direction? Thanks! 回答1: I figured this

Jade Inline Conditional

阅读更多关于 Jade Inline Conditional

问题 I'm trying to make everything apart from the first element in an array have a CSS class using the Jade templating engine. I was hoping I could do it like this, but no luck. Any suggestions? - each sense, i in entry.senses div(class="span13 #{ if (i != 0) 'offset3' }") ... a tonne of subsequent stuff I know I could wrap the code as below, but as far as I understand Jade's nesting rules to work, I'd have to duplicate the code or extract it to a Mixin or something. - each sense, i in entry

CSS how to make scrollable list

阅读更多关于 CSS how to make scrollable list

问题 I am trying to create a webpage which is made up of a header and bellow the header a list of items. I want the list of items to be vertically scrollable. I also would like the webpage to take up the entire window but not be bigger. Currently my problem is the list of items is not scrollable and instead extends far below the bottom of the window and this is causing the window to be scrollable. What should the CSS properties be on the html , body , header and list items ? doctype html html head

Is it considered bad practice to use HTML in Jade?

阅读更多关于 Is it considered bad practice to use HTML in Jade?

问题 Jade looks like a cool templating engine and I think I'll be using it for my next project. However, some of the syntax doesn't make sense to me. What do you get by doing this: ul li a(href="#book-a") Book A instead of: <ul> <li><a href="#book-a">Book A</a></li> </ul> I understand you save some typing, but it seems less readable to me. I noticed on Jade's live demo that regular html passes right through the translation. So would it be considered bad practise to do something like this: <div

How to use the style tag with jade templates?

阅读更多关于 How to use the style tag with jade templates?

问题 This style code worked for me a few months back. I have updated to the latest Jade NPM package and now it is not working. Can some please assist me with the proper way to inline a style in a Jade template? doctype 5 html(lang="en") head style(type='text/css') .ui-title { margin: 0.6em 10% 0.8em !important; } I get this error on the closing } unexpected text } 回答1: There are three ways of putting text inside your tags in Jade 1. Put text just after the tag e.g. h1 Some header text And the

Recursive iteration over an object in Jade template?

阅读更多关于 Recursive iteration over an object in Jade template?

I have an object of mixed type properties - some strings, some arrays of strings, some objects containing arrays of strings - that can potentially go many levels deep. I would like to iterate over all properties so that an object creates a div, an array creates a div, and a string property creates a span to contain the text. { "string" : "some text", "object" : { "array" : [ "text" ] } } The above object would render as: <span>some text</span> <div> <div> <span>text</span> </div> </div> But usually much more complex structures. How should I go about accomplishing this is Jade? mna It's been a