Почему Angular 6 post не запрашивает метод WebApi MVC 5? - PullRequest
0 голосов
/ 12 октября 2018

У меня есть WebApi, на который я уже отправил запрос из другого приложения.Все работало правильноЯ написал в WebApiConfig config.EnableCors(new EnableCorsAttribute("http://localhost:4200", headers: "*", methods: "*")); Теперь я создал другое приложение и хочу отложить мой пост-метод для этого API.Я создал форму и написал метод для отправки ее в API

postUser(user: User) {
var httpOptions = { headers: new HttpHeaders({
  'Content-Type': 'application/json'
})};
var body = JSON.stringify(user);
return this.http.post<User>('http://localhost:51251/api/Users', body, httpOptions);
}  

Я создал те же пользовательские классы для TS и CS

export class User {
Id: number;
Email: string;
Password: string;
ConfirmPassword: string;
}

public class User
{
    public int Id { get; set; }
    public string Email { get; set; }
    public string Password { get; set; }
    public string ConfirmPassword { get; set; }
}

мой пост-метод в API:

// POST: api/User
    [ResponseType(typeof(User))]
    public IHttpActionResult PostUser(User user)
    {
        db.Users.Add(user);
        db.SaveChanges();

        return CreatedAtRoute("DefaultApi", new { id = user.Id }, user);
    }

В консоли лог тела вот так {"Id":null,"Email":"weferer@frr5","Password":"12","ConfirmPassword":"12"} Но никуда не отправляется запрос, и я не могу понять почему.Ошибки не отображаются.В чем может быть причина?

1 Ответ

0 голосов
/ 12 октября 2018

При Component или аналогичном выполнении postUser() вы должны вызвать subscribe(), чтобы запрос действительно выполнялся.Предполагая postUser() в Injectable сервисе:

Сервис:

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';

@Injectable()
export class SomeService {
   constructor(private http: HttpClient) { }

   postUser(user: User) {
     const httpOptions = { headers: new HttpHeaders({
       'Content-Type': 'application/json'
     })};

     const body = JSON.stringify(user);

     return this.http.post<User>('http://localhost:51251/api/Users', body, httpOptions);
  } 
}

Компонент:

import { Component } from '@angular/core';
import { SomeService } from 'path/to/service';

@Component({ // ... })
export class AppComponent  {
  constructor(private someService: SomeService) {}

  someMethod() {
    this.someService.postUser(someUser).subscribe(results => console.log(results));
  }
}

Надеюсь, это поможет!

...