Good Morning Friends,
I'm learning Angular, using version 4.4.6 with Angular-Cli and I'm having trouble using the http post service.
First I created a date folder where I stored my json file and added it to the angular-cli.json file.
.angular-cli.json:
"assets": [
"assets",
"favicon.ico",
"data"
],
Then I added the HttpClientModule module in the app.module.ts file
app.module.ts:
import { HttpClientModule } from '@angular/common/http';
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
@NgModule({
declarations: [
AppComponent,
CadastroComponent
],
imports: [
BrowserModule,
HttpModule,
HttpClientModule,
FormsModule,
ReactiveFormsModule,
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
And finally, my component cadastro.component to run an http post in my json file.
cadastro.component.ts:
import { Component, Input, Injectable } from '@angular/core';
import { Http, Headers } from '@angular/http';
import { HttpClient, HttpHeaders } from '@angular/common/http';
import { ParametroComponent } from './../parametro/parametro.component';
@Component({
moduleId: module.id,
selector: 'cadastro',
templateUrl: './cadastro.component.html'
})
@Injectable()
export class CadastroComponent {
parametro: ParametroComponent = new ParametroComponent();
http: HttpClient;
private data_Url = './asset/data/data.json';
constructor(private http: HttpClient) {
this.http = http;
}
atualizar() {
event.preventDefault();
console.log(this.parametro);
this.http.post(this.data_Url, this.parametro).subscribe(() => {
this.parametro = new ParametroComponent();
console.log('Parametro Atualizado com sucesso');
}, erro => {
console.log(erro);
});
}
}
parametro.component.ts:
import { Component, OnInit, Input } from '@angular/core';
@Component({
selector: 'parametro',
templateUrl: './parametro.component.html',
styleUrls: ['./parametro.component.css']
})
export class ParametroComponent {
@Input() legado: string = '';
@Input() produto: string = '';
@Input() subproduto: string = '';
@Input() tpoevento: string = '';
@Input() familia: string = '';
@Input() tpocontrato: string = '';
@Input() descrevento: string = '';
@Input() cdorigem: string = '';
@Input() evenprivate: string = '';
@Input() efeposicao: string = '';
@Input() efeifinan: string = '';
@Input() excluirmov: string = '';
_id: string = '';
}
Lastly, running the browser (Chrome) returns the POST error link 404 (Not Found)
I did not find anything that could help me solve this problem.
Thank you in advance for the help.