MikeB
MikeB

Reputation: 788

Nodejs/Express - 'title' not rendering

I am working through Sams "Node.js in 24 Hours". Chapter 8 is giving me difficulty (longer more than an hour)! Example 07 allows the programmer to create a page whereby a user can create a task list that is stored in MongoDb. The code uses Express and Jade. Following the instructions everything works ... except that I noticed that 'title' isn't rendering and instead I get a generic title, the directory path of the route. My question is why? I think I am using res.render correctly, the Jade index/layout files agree with the author's (checked https://github.com/shapeshed/nodejsbook.io).

Update: Since it looked like layout.jade was being ignored, I removed it. No error resulted and the problem remains. Why/how could layout.jade be ignored?

** Conclusion **: 'Node.js in 24 Hrs' assumes Express 2. Following the book's installation instructions however installs Express 3, hence the difficulties (remedy below). Note that the Chapter 8 of this book introduces coupling Node.js/Mongodb/Jade/Flash after only the simplest intro to Jade (Chap 6) and none at all to Flash. It will take more than an hour unless you are already a reasonably seasoned front-end developer.

The directory structure is:

\connect_to_mongo
 |
 |-  \node_modules
 |-  \public
 |-  \routes
 |-  \views
 |    |- \tasks
 |    |    |- index.jade
 |    |    |- new.jade
 |    |- index.jade
 |    |- layout.jade
 |- app.js
 |- package.json

app.js contains:

app.get('/tasks/new', function(req,res) {
    Task.find({}, function(err,docs) {
        res.render('tasks/new.jade', {
            title:'New Tasks'
        });
    });
});

layout.jade is:

!!!
html
  head
    title #{title}
    link(rel='stylesheet', href='http://twitter.github.com/bootstrap/1.4.0/bootstrap.min.css')
  body
    section.container!= body

tasks/index.jade is:

h1 Your tasks
p
  a(href='/tasks/new', class='btn primary') Add a Task

- if(docs.length)
  table
    tr
      th Task
        each task in docs
          tr
            td #{task.task}
- else
  p You don't have any tasks!

Upvotes: 1

Views: 1658

Answers (2)

robertklep
robertklep

Reputation: 203359

Layouts have been deprecated in Express 3 (which you're probably using).

Instead, you need to use template inheritance:

// layout.jade
...
section.container
  block body
// tasks/index.jade
extends ../layout

block body
  h1 Your tasks
  ...

Alternatively, you could install Express 2 instead of Express 3, since you might run into other problems if your book assumes version 2:

npm install [email protected]

Upvotes: 2

jmingov
jmingov

Reputation: 14003

Remove the =

it should be

title #{title}

Upvotes: 4

Related Questions