Angular2: Как отправить данные от клиента на сервер при выполнении запроса

Question

Существует форма и кнопка на стороне клиента, я хочу отправить данные, которые пользователь вводил в форму, на сервер, где есть обработчик запросов, который сохраняет данные к базе данных и от базы данных к клиенту.

Как я могу это сделать Я запутался в логике, я думаю, что есть использование синтаксического анализатора тела, также какова роль заголовков, опция запроса в этом случае, я нашел это решение, но я не реализую с закрытыми глазами, я просто хочу, чтобы сделать это мой путь после понимания

на стороне клиента:

let headers: Headers = new Headers(); 
headers.append('Content-Type', 'application/json'); 
let opts: RequestOptions = new RequestOptions(); 
opts.headers = headers; 
this.http.post('http://localhost: 
3000/addStudent',JSON.stringify(obj),opts).subscribe((res: Response) => { 
      console.log(res.json()) 
      setTimeout(()=>{ 
      this.students = res.json(); 
     }, 3000) 
     }) 

на стороне сервера:

app.post('/addStudent',function(req,res){ 
var newStudent = new StudentModel(req.body); 
console.log(req.body); 
newStudent.save(); 
StudentModel.find(function(err,data){ 
    if(err) res.send(err) 
    else{ 
     res.json(data) 
    } 
}) 

Answer 1

Ну ваш вопрос связан с HTTP i.e обмен данными с клиентской и серверной сторон. так делать то же самое первое что вам нужно нужно добавить http файл в файл index.html так:

<script src="node_modules/angular2/bundles/http.dev.js"></script> 

и вы должны добавить HTTP_PROVIDERS ли в галстуке начальной загрузки или в списке поставщиков.

так что теперь приходят к RequestOptions, Headers etc. во-первых, импортировать их по мере необходимости здесь ...

import {Http, Response, RequestOptions, Headers, Request, RequestMethod} from 'angular2/http'; 

Роль заголовка:

В основном заголовок используется для добавления Content-Type или какой-то конфиденциальные данные, такие как username,Password, которые мы хотим отправить на сервер. у нас есть часть тела, которая также используется для отправки данных на сервер. например:

this.headers = new Headers(); 
    this.headers.append("Content-Type", 'application/json'); 
    this.headers.append("Authorization", 'confidential data or 
    something like that') 

RequestOptions:

Bascially RequestOptions является сбор некоторых properts как method (GET, POST, PUT ....), url or path to json file etc, Headersbody part и многое другое. мы можем добавить различные optipon по мере необходимости. например, здесь приведен пример использования RequestOptions.

this.requestoptions = new RequestOptions({ 
       method: RequestMethod.Post, 
       url: "url path....", 
       headers: this.headers, 
       body: JSON.stringify(data) 
      }); 

вот несколько лучших учебных пособий, которые я нашел для них. надеюсь, это может вам помочь.

@Pardeep.

http://www.syntaxsuccess.com/viewarticle/angular-2.0-and-http

https://auth0.com/blog/2015/10/15/angular-2-series-part-3-using-http/

https://angular.io/docs/js/latest/api/http/Request-class.html