#c# #asp.net #angular
#c# #asp.net #угловой
Вопрос:
Я не могу понять, почему мой метод POST не работает. С API все в порядке, и я думаю, что CORS тоже работает нормально, поскольку я могу получать данные из базы данных в своем браузере через Angular.
Мне сложно отлаживать, поскольку ответ об ошибке не содержит много четкой информации (по крайней мере, я не смог ее найти).
Я тоже консоль.регистрация данных из формы в моем браузере, что означает, что данные отправляются правильно.
Вот сообщение об API:
[HttpPost]
public ActionResult<Record> AddRecord(Record record)
{
_context.Records.Add(record);
_context.SaveChanges();
return Ok();
}
Вот форма
<form #form="ngForm" autocomplete="off" (submit)="onSubmit(form)">
<div class="form-group">
<input
name="Date"
#Date="ngModel"
[(ngModel)]="service.formData.Date"
class="form-control"
placeholder="Date"
required>
</div>
<div class="form-group">
<input
name="Name"
#Name="ngModel"
[(ngModel)]="service.formData.Name"
class="form-control"
placeholder="Name"
required>
</div>
<div class="form-group">
<input
name="Value"
#Value="ngModel"
[(ngModel)]="service.formData.Value"
class="form-control"
placeholder="Value"
required>
</div>
<div class="form-group">
<input
name="Category"
#Category="ngModel"
[(ngModel)]="service.formData.Category"
class="form-control"
placeholder="Category"
required>
</div>
<div class="form-group">
<input
name="Type"
#Type="ngModel"
[(ngModel)]="service.formData.Type"
class="form-control"
placeholder="Type"
required>
</div>
<div class="form-group">
<button class="btn-success btn-lg btn-block" type="submit">Submit</button>
</div>
</form>
вот компонент:
export class RecordDetailComponent implements OnInit {
constructor(public service: RecordDetailService) { }
ngOnInit(): void {
this.resetForm();
}
resetForm(form?: NgForm) {
if (form != null)
form.resetForm();
this.service.formData = {
Date : "",
Name: "",
Value: 0 ,
Category: "",
Type: ""
}
}
onSubmit (form: NgForm) {
this.service.postRecordDetail(form.value).subscribe(
res=> {
console.log("Deu Certo Porra")
debugger
this.resetForm(form);
},
err=> {
debugger
console.log(err);
}
);
}
}
Вот сервис:
import { Injectable } from '@angular/core';
import { RecordDetail } from './record-detail.model';
import { HttpClient } from "@angular/common/http"
@Injectable({
providedIn: 'root'
})
export class RecordDetailService {
formData: RecordDetail
readonly rootURL = 'http://localhost:5001/api'
constructor(private http: HttpClient) { }
postRecordDetail(formData: RecordDetail) {
console.log(formData)
return this.http.post(this.rootURL '/records', formData)
}
}
Комментарии:
1. Пожалуйста, используйте вкладку Network в Chrome Developer Tools, чтобы получить точную отправленную полезную нагрузку (и поделитесь ею в своем вопросе).
2. @mjwills Я добавил пару картинок с дополнительной информацией
3. Попробуйте преобразовать поля ввода формы в экземпляр типа / интерфейса, обновите свой сервис, чтобы принять этот тип. Это позволит сохранить службу в чистоте.
4. Кроме того, используйте postman для ручной проверки работоспособности api. Наряду с предварительной проверкой параметров, все работает как ожидалось.
5. Я нашел проблему. Это было здесь: «только для чтения rootURL =’ localhost: 5001 / api ‘» … должно быть ‘https’. на это ушло два часа моей жизни: (