2016-10-26 13 views
0

MEANスタック(MySQL、Express、Angular、Node)を使用してデータベースにデータを挿入する方法はありますか? 私は挿入時に問題に直面しています。これを解決するために私を助けてください。ここに私のコードです。私はまったく初心者です。MEANスタック(MySQL、Express、Angular、Node)を使用してデータベースにデータを挿入する方法

index.htmlを

<html ng-app="bookitnow"> 
<head> 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 

    <title> Registration Page </title> 
</head> 
<body> 
<div class="container" ng-app="bookitnow" ng-controller="myCtrl"> 
    <h1>Register</h1> 
    <form method="post"> 
    <div class="form-group"> 
     <input type="text" class="form-control" id="firstName" ng-model="fname" placeholder="First Name" required> 
    </div> 
    <div class="form-group"> 
     <input type="text" class="form-control" id="lastName" ng-model="lname" placeholder="Last Name" required> 
    </div> 
    <div class="form-group"> 
     <input type="email" class="form-control" id="email" ng-model="email" placeholder="Email Address" required> 
    </div> 
    <div class="form-group"> 
     <input type="text" class="form-control" id="phone" ng-model="phone" placeholder="Phone" required> 
    </div> 

<button type="submit" class="btn btn-info" ng-click="submit()">Submit</button> 

</form> 
</div> 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script> 
<script src="controllers/controller.js"></script> 

</body> 
</html> 

server.js

var express = require("express"); 
var app = express(); 
var bodyParser = require('body-parser'); 
var mysql  = require('mysql'); 
var connection = mysql.createConnection({ 
    host  : 'localhost', 
    user  : 'root', 
    password : '', 
    database : 'bookitnow' 
}); 

connection.connect(function(err) { 
    if (!err) 
    console.log('Database is connected'); 
    else 
    console.log('DB connection error.'); 
}); 

app.use(express.static(__dirname + '/public')); 

app.get('/index.html', function(req, res){ 
    res.sendFile(__dirname + '/public' + 'index.html'); 
}); 


app.post('/index.html', function(req, res, next) { 
    var data = req.body; 
    console.log('request received:', data); 

    connection.query('INSERT INTO register SET ?', data, function(err,res){ 
     if(err) throw err; 
     console.log('record inserted'); 
    }); 

app.listen(5500); 

console.log('Hi from server.js'); 

controller.js

var app = angular.module('bookitnow',[]); 
     app.controller('myCtrl', function($scope,$http){ 
     $scope.submit = function() { 

      var data = { 
        fName : $scope.fname, 
        lName : $scope.lname, 
        email : $scope.email, 
        phone : $scope.phone 
       } 
      }; 

      $http.post('/index.html', &scope.data) 
      .success(function (data, status, headers, config) { 
        $scope.result = data; 
        console.log("inserted successfully") 
       }) 
       .error(function(data, status, header, config){ 
        $scope.result = "Data: " + status; 


       }); 
+0

体内で何が得られますか?console.log( 'request received:'、data); '? – abdulbarik

答えて

0

あなたのcontroller.jsで、以下を試して何が起こるかを見てください。

var app = angular.module('bookitnow',[]); 
app.controller('myCtrl', function($scope, $http){ 
    $scope.submit = function() { 

     var data = { 
      fName : $scope.fname, 
      lName : $scope.lname, 
      email : $scope.email, 
      phone : $scope.phone 
     }; 

     $http 
      .post('/index.html', data) 
      .then(function (response) { 
       console.log(response) 
      }, function(response){ 
       console.log(response) 
      }); 
    }; 
}); 
+0

あなたが言ったのと同じことをしました...エラーを表示しているコントローラ:POST http:// localhost:5500/index.html net :: ERR_CONNECTION_REFUSED controller.js:17 failed ... –

+0

今ですか? –

+0

サーバーが稼働していますか? – zee

関連する問題