傳遞JSON來的Node.js從Angular2組件

Question

我試圖將數據插入到從Angular2和Node.js的

數據庫運行我的劇本我console.log(this.address);，以確保我傳遞json，這是輸出到控制檯。

Address {street: "1111 NW 40TH AVE", city: "MIAMI", state: "Florida", zip: "33167"} 

但是記錄沒有輸入數據庫。我知道我有一個連接，但我在這裏失去了一些東西，不知道如何從這裏拍攝它的麻煩。

在組件，這是http.post

addressSubmit() { 
     this.addressSubmitted = true; 
     var headers = new Headers(); 
     headers.append('Content-Type', 'application/json'); 
     this.http 
     .post('http://localhost:4200/profile/addAddress', this.address, { headers: headers }) 
     .map(response => response.json()); 
     console.log(this.address); 
    } 

與功能，我知道我有一個似乎在傳遞 json功能

左右。

在我收到這樣的JSON節點後端

然後，

addAddress: function(req, res) { 
     pool.connect(function(err, client, done) { 
      if (err) { 
       return console.error('error fetching client from pool', err); 
      } // end of error catch while creating pool connection 

      var query = client.query("insert into address (street, city, state, zip) " + 
      "values ('" + req.query.street + "','" + req.query.city + "','" + 
      req.query.state + "','" + req.query.zip + "')"); // create the query 

      query.on("end", function(result) { 
       client.end(); 
       res.write('Success'); 
       res.end(); 
      }); // handle the query 
      done(); // release the client back to the pool 
     }); // end of pool connection 
     pool.on('error', function(err, client) { 
       console.error('idle client error', err.message, err.stack) 
      }); // handle any error with the pool 
    } // End addAddress function 

處理這樣的路線，

router.get('/profile/addAddress', connection.addAddress); 

在app.js

app.get('/profile/addAddress', function(req,res){ 
    db.addAddress(req,res); 
}); 

所以在此刻。我知道我正在傳球。我知道我有一個連接到數據庫。我可以通過手動輸入並將其輸出到express route來檢索條目並將其輸出到瀏覽器。

我只是錯過了從angular2到node來回傳遞數據。然後從node回到angular2。

現在用echonax答案的幫助下，我有這個在網絡選項卡下的查詢字符串，

查詢字符串PARAMATERS

street:11700 NW 36TH AVE 
city:MIAMI 
state:Florida 
zip:33167 

Answer 1

我想你是不是讓你的後端的請求。

你

this.http 
     .post('http://localhost:4200/profile/addAddress', this.address, { headers: headers }) 
     .map(response => response.json()); 

線返回可觀察到的，只有當它被訂購此觀察到被調用。

這樣會讓你的addressSubmit()回報這個觀察到的是這樣的：

addressSubmit() { 
     this.addressSubmitted = true; 
     var headers = new Headers(); 
     headers.append('Content-Type', 'application/json'); 
     return this.http 
     .post('http://localhost:4200/profile/addAddress', this.address, { headers: headers }) 
     .map(response => response.json()); 
    } 

然後在代碼中調用它是這樣的：

this.addressSubmit().subscribe((response)=>{ 
    //do something with the response here 
    console.log(response); 
})