lundi 31 août 2015

Posting data from AngularJS with Express, Node and Rest

Im quite new to the javascript stack and been trying to get a form post from angular onto to mongo. I am able to get a list back, but not able to post.

The below code lists ok, but when I post, it posts a blank record (and moreover, it keeps posting every couple of minutes even though I dont do any action on the page)

I can see that its able to call the serverside method, but the data is not being passed on towards persistance.

I know im doing something stupid, but just not sure what it is. Ive searched all over google, but dont see the solution which I can take. Any help would be greatly appreciated.

============jade================
    div(ng-app="sell" ng-controller="sellCtlr")
        .container-fluid
        form#listingForm.form-horizontal
                      .form-group
                       .row
                           .col-xs-8
                               label.control-label(for="title") title 
                               input#title.form-control(type="text", name="title", ng-model="listing.title")
                   .form-group
                       .row
                           .col-xs-8
                               label.control-label(for="subTitle") sub-title
                               input#subTitle.form-control(type="text", name="subTitle",, ng-model="listing.subTitle")


============app.js================
/* server side controllers **/
var listController = require('./server/controllers/list-controller');

/* routes */
var sell = require('./client/routes/sell');

/* rest api */
app.get('/api/listings', listController.list);
app.post('/api/listings', listController.create);

/* sell route */
app.use('/sell', sell);

============sell.js (sell route)================
var express = require('express');
var router = express.Router();

/* GET sell page. */
router.get('/', function(req, res, next) {
    res.render('sell', { title: 'Express' });
});

/* POST sell page. */
router.post('/api/listings', function(req, res, next) {
    res.render('sell', { title: 'Express' });
});

module.exports = router;

============sellCtlr.js (client side)================    

var app = angular.module('sell', ['ngResource']);

app.controller('sellCtlr', ['$scope', '$resource',
    function($scope, $resource){

    var Listing = $resource('/api/listings');
    $scope.listing = new Listing();

    $scope.createListing = function(){

        Listing.save($scope.listing, function(){
            //data saved. do something here.
        });//saves an entry. Assuming $scope.listing is the Listing object
        };
    }]);

============list-controller.js (server side)================

var Listing = require('../models/listing');

// save listing
module.exports.create = function (req, res) {
  var listing = new Listing(req.body);
  listing.save(function (err, result){
      res.json(result);
  });
}
//retrieve all listings
module.exports.list = function(req, res){
Listing.find({}, function(err, results) {
    res.json(results);
});
}


============listing.js (model, server side)================

var mongoose = require('mongoose');

module.exports = mongoose.model('Listing', {
  title: String,
  subTitle: String

});

Many Thanks guys



via Chebli Mohamed

Aucun commentaire:

Enregistrer un commentaire