Question

所以我是MEAN世界的新手。我指的是这本书用平均堆栈Mongodb Express Angularjs和Node.js写现代Web应用程序。因此，在本书中，他们教我们如何使用MEAN堆栈构建Twitter关闭。我刚从书中复制了代码，但它无效。你能救我一下吗？

的package.json

＆＃13;

{
  "name": "socialapp",
  "dependencies": {
    "body-parser": "^1.13.0",
    "mongoose": "^3.8.30"
  }
}

＆＃13;

server.js

＆＃13;

var express = require('express')
var bodyParser = require('body-parser')
var Post = require('./models/post')

var app = express()
app.use(bodyParser.json())

app.get('/api/posts', function (req, res, next) {
  Post.find(function(err, posts) {
    if (err) { return next(err) }
    res.json(posts)
  })
})

app.post('/api/posts', function (req, res, next) {
  var post = new Post({
    username: req.body.username,
    body: req.body.body
  })
  post.save(function (err, post) {
    if (err) { return next(err) }
    res.json(201, post)
  })
})

app.listen(3000, function () {
  console.log('Server listening on', 3000)
})

app.get('/', function (req, res) {
  res.sendFile('layouts/posts.html', { root: __dirname });
})

＆＃13;

db.js

＆＃13;

var mongoose = require('mongoose')
mongoose.connect('mongodb://localhost/social', function () {
  console.log('mongodb connected')
})
module.exports = mongoose

＆＃13;

模型/ post.js

＆＃13;

var db = require('../db')
var Post = db.model('Post', {
  username: { type: String, required: true },
  body:     { type: String, required: true },
  date:     { type: Date, required: true, default: Date.now }
})
module.exports = Post

＆＃13;

布局/ posts.html

＆＃13;

<!DOCTYPE html>
<html>
<head>
  <link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
   <script src='https://ajax.googleapis.com/ajax/libs/angularjs/1.3.16/angular.min.js'></script>
</head>
<body ng-app='app'>
  <div ng-controller='PostsCtrl' class='container'>
    <h1>Recent Posts</h1>
    <form role='form'>
      <div class='form-group'>
        <div class='input-group'>
          <input ng-model='postBody' class='form-control' />
          <span class='input-group-btn'>
            <button ng-click='addPost()' class='btn btn-default'>Add Post</button>
          </span>
        </div>
      </div>
    </form>
    <ul class='list-group'>
      <li ng-repeat='post in posts' class='list-group-item'>
        <strong>@{{ post.username }}</strong>
        <span>{{ post.body }}</span>
      </li>
    </ul>
  </div>
  <script>
    // create our app module
    var app = angular.module('app', [])

    // create the PostsCtrl module
    // dependency inject $scope
    app.controller('PostsCtrl', function ($scope,$http) {

      $scope.addPost = function () {
          if ($scope.postBody) {
            $http.post('http://localhost:3000/api/posts', {
            username: 'rahul23khanna',
            body: $scope.postBody
            }).success(function (post) {
              $scope.posts.unshift(post)
                $scope.postBody = null
                })
            } 
          }

      // starting data
     $http.get('http://localhost:3000/api/posts')
     .success(function (posts) {
          $scope.posts = posts
      })
   })
  </script>
</body>
</html>

＆＃13;

在给出POST请求时，Angular应用程序会挂起，Chrome控制台会出现错误ERR_EMPTY_RESPONSE？

0 个答案: