title: Express 4: How do I send JSON object to view?
body: <p>I've researched for the past few days and I cannot figure this one out. </p>
  
  <p>Goal: User uploads a text file using the angular-file-upload form, and multer saves the file to a temporary folder. The data then POSTs and the user can see the file metadata and contents either on the same page, or a redirected page. </p>
  
  <p>Problem: In my POST route, I can console.log(req.file) and it shows file the metadata. The file saves to the temporary folder.</p>
  
  <p>I've tried to res.send(req.file), res.json(req.file), data binding the metadata in the controller scope, res.locals, middleware functions, and many other things that I can't even remember. The json object never comes through to the view.</p>
  
  <p>Here's a snippet of what I'm working with. </p>
  
  <p><strong>routes.js</strong></p>
  
  <pre><code>var express = require('express');
  var app = express();
  var router = express.Router();
  
  router.get('/test', function(req, res, next){
    res.render('test', {title: 'Test'});
  });
  
  router.post('/test', function(req, res, next){
    console.log(req.file);
    res.json(req.file);
  });
  
  module.exports = router;
  </code></pre>
  
  <p><strong>app.js</strong></p>
  
  <pre><code>var express = require('express');
  var path = require('path');
  var cookieParser = require('cookie-parser');
  var bodyParser = require('body-parser');
  var logger = require('morgan');
  var sys = require('sys');
  var multer = require('multer');
  var app = express();
   // Local Files
  var routes = require('./routes/index');
  var users = require('./routes/users');
  var favicon = require('serve-favicon');
  // console.log(__dirname + '/public/scripts/test.py');
  
  // Create multer object for file uploads
  var storage = multer.diskStorage({
    destination: function (req, file, cb) {
      cb(null, './tmp/')
    }
    // filename: function (req, file, cb) {
    //   cb(null, file.originalname + "%" + Date.now())
    // }
  });
  
  // view engine setup
  app.set('views', path.join(__dirname, 'views'));
  app.set('view engine', 'jade');
  app.use(favicon(__dirname + '/public/favicon.ico'));
  app.use(logger('dev'));
  app.use(cookieParser());
  app.use(bodyParser.json());
  app.use(bodyParser.urlencoded({ extended: true }));
  // app.use(express.bodyParser( { keepExtensions: true, uploadDir: __dirname + '/photos' } ));
  app.use(express.static(path.join(__dirname, 'public')));
  app.use(express.static(path.join(__dirname, 'bower_components')));
  app.use(multer({ storage: storage }).single('file'));
  app.use('/', routes);
  app.use('/users', users);
  </code></pre>
  
  <p><strong>controller.js</strong></p>
  
  <pre><code>var t = angular.module('upload', ['ngFileUpload']);
  
  t.controller('ctrl', ['$scope', 'Upload', '$timeout', function ($scope, Upload, $timeout) {
      $scope.f = '';
      $scope.uploadFiles = function(file) {
          $scope.f = file;
          console.log(file);
          if (file &amp;&amp; !file.$error) {
              file.upload = Upload.upload({
                  url: '/test',
                  file: file
              });
              file.upload.then(function (response) {
                  $timeout(function () {
                      file.result = response.data;
                  });
              }, function (response) {
                  if (response.status &gt; 0)
                      $scope.errorMsg = response.status + ': ' + response.data;
              });
              file.upload.progress(function (evt) {
                  file.progress = Math.min(100, parseInt(100.0 * evt.loaded / evt.total));
              });
          }
      }
  }]);
  </code></pre>
  
  <p><strong>req.file</strong></p>
  
  <pre><code>{ fieldname: 'file',
    originalname: 'lorem.rtf',
    encoding: '7bit',
    mimetype: 'text/rtf',
    destination: './tmp/',
    filename: '0b9d25cc663a05628059bd56a0aef4bc',
    path: 'tmp/0b9d25cc663a05628059bd56a0aef4bc',
    size: 815 }
  </code></pre>