Tuesday 16 May 2017

Getting an Internal server Error when trying to post product with angular Js (MEAN Stack)

I really need some help. I'm facing with an Internal Server error when i try to add product through http service ($http.post) in angular js. So basically, the files you need to help me to get out from this frustration are:

**index.js : Here I define api routes of my express server

var express = require('express'); 
var router = express.Router(); 
var productCtrl = require('../controllers/productCtrl'); 

router.get('/products', productCtrl.getAllProducts); 
router.get('/products/:productId', productCtrl.readProduct); 
router.post('/products', productCtrl.createProduct); 
router.delete('/products/:productId', productCtrl.removeProduct); 
router.put('/products/:productId', productCtrl.updateProduct); 

module.exports = router; 

**product.js : The product model

var mongoose = require('mongoose'); 

var productSchema = new mongoose.Schema({
  name: {type: String, required: true}, 
  category: {type: String, default: ''}, 
  price: { type: Number, default: 0}, 
  picture: String, 
  pictures: [String], 
  quantity: {type: Number, default: 0}, 
  status: { 
    type: String, 
    enum: ['Pending', 'In Progress', 'Cancelled', 'Done'], 
    default: 'Pending' 
 }, 
   date: { type: Date, default: Date.now}, 
   description: { type: String}, 
   owner: {type: String}
 }); 

 var Product = mongoose.model('Product', productSchema); 

 module.exports = Product; 

**productCtrl.js: My controller on Express Server where i build a rest API

var Product = require('../models/product'); 

var sendJsonResponse = function (res, status, content ){
   res.status(status); 
   res.json(content); 
}

 /* some other code here, but i will only show create action */ 
 module.exports.createProduct = function (req, res){
  Product
      .create({
        name: req.body.name, 
        category: req.body.category, 
        price: req.body.price, 
        picture: req.body.picture, 
        pictures: req.body.pictures.split(", "), 
        quantity: req.body.quantity,
        status: req.body.status, 
        date: req.body.date, 
        description: req.body.description, 
        owner: req.body.owner

      }, function createProduct(err, product){
        if(err){
            sendJsonResponse(res, 404, err); 
            return; 
        }
        else {
            sendJsonResponse(res, 201, product); 
        }
      });
 }

And finally in my angular module script file : app.js

(function(){ 
   var app = angular.module('ecommerce', []); 

   app.controller('ProductController', 
   ['$scope','$http', function ($scope, $http){
    console.log('Welcome to the ProductController'); 
     /* some other code here */

    $scope.addProduct = function (){ 

        var newProduct = {
                    name: $scope.product.name, 
                    category: $scope.product.category, 
                    price: $scope.product.price, 
                    picture: $scope.product.picture, 
                    pictures: [], 
                    quantity: 10,  
                    status: "Pending", 
                    date: Date.now(), 
                    description: $scope.product.description, 
                    owner: "Joel Alexandre Khang Zulbal"
        }; 

        console.log(newProduct); 
        alert("Passing variable..."); 

        $http.post('/api/products', newProduct)
             .then( function onSuccessCallback(){
                    $scope.products.push($scope.product); 
                        alert("Success Insertion"); 
                        $scope.$apply(); 
                 }, function onErrorCallback (error){
                        console.log(error); 
                        alert("Insertion failed!!"); 
                 }); 

            $scope.product = {}; 
            $scope.close(); 
    }
    /* some other code here */

}]); 

})()

I really don't know what i'm doing wrong here! So please guys help me



via Joel Alexandre Khang

No comments:

Post a Comment