Boa tarde amigos, Montei o backend MEAN conforme explicado no curso. E agora que estou implementando ele na minha aplicação Angular 2 estou tendo alguns problemas. A leitura de dados funciona perfeitamente. Mas estou tendo dificuldades no cadastro de novos dados. Alguém poderia me elucidar em como resolver? Segue em anexo algumas imagens dos erros:
Na minha percepção, o id era preenchido automaticamente... porém ele não está sendo preenchido. E agora?
Versões utilizadas MongoDB shell version v3.4.1; mongoose@4.8.1; express@4.14.1;
A seguir alguns códigos: ANGULAR 2:
clients.component.ts
import { Component, Input } from '@angular/core';
@Component({
selector: 'client',
templateUrl: './clients.component.html'
})
export class ClientsComponent{
_id: string = '';
@Input() nome: string = '';
@Input() cpf: string = '';
@Input() email: string = '';
@Input() telefone: string = '';
}
clientsNew.component.ts
import { Component } from '@angular/core';
import { ActivatedRoute, RouterModule, Routes, Router } from '@angular/router';
import { FormGroup, FormBuilder, Validators } from '@angular/forms';
import { ClientsService } from '../clients.service';
import { ClientsComponent } from '../clients.component';
@Component({
selector: 'client-new',
templateUrl: './clientsNew.component.html',
styleUrls: ['./clientsNew.component.scss']
})
export class ClientsNewComponent {
new_data: ClientsComponent = new ClientsComponent();
newForm: FormGroup;
service: ClientsService;
route: ActivatedRoute;
router: Router;
constructor(service: ClientsService, fb: FormBuilder, route: ActivatedRoute, router: Router) {
this.service = service;
this.route = route;
this.router = router;
this.newForm = fb.group({
cpf: ['', Validators.compose([Validators.required, Validators.minLength(4)])],
nome: ['', Validators.required],
telefone: [''],
email: [''],
});
}
submit_form(event) {
event.preventDefault();
console.log(this.new_data);
this.service
.cadastra(this.new_data)
.subscribe(res => {
this.new_data = new ClientsComponent();
if(!res.inclusao) this.router.navigate(['']);
}, erro => console.log(erro));
}
clientsNew.component.html
<div class="session md-indigo">
<div class="session-content">
<div class="session-wrapper">
<form [formGroup]="newForm" (submit)="submit_form($event)">
<md-card>
<md-card-content>
<div class="text-xs-center pb-1">
<button md-mini-fab color="warn" disabled="" md-card-icon class="shadow-none">
<md-icon>person</md-icon>
</button>
<p class="md-text-muted">Cadastro de Cliente</p>
</div>
<div fxLayout="column" fxLayoutAlign="space-around">
<div class="pb-1">
<md-input-container style="width: 100%;" >
<input md-input
name="cpf"
formControlName="cpf"
placeholder="CPF"
[(ngModel)]="new_data.cpf"
class="ml-xs mr-xs"
autocomplete="off">
</md-input-container>
</div>
<div class="pb-1">
<md-input-container style="width: 100%;" >
<input md-input
name="nome"
formControlName="nome"
placeholder="Nome Completo"
[(ngModel)]="new_data.nome"
class="ml-xs mr-xs"
autocomplete="off">
</md-input-container>
</div>
<div class="pb-1">
<md-input-container style="width: 100%;" >
<input md-input
name="telefone"
formControlName="telefone"
placeholder="Telefone"
[(ngModel)]="new_data.telefone"
class="ml-xs mr-xs"
autocomplete="off">
</md-input-container>
</div>
<div class="pb-1">
<md-input-container style="width: 100%;" >
<input md-input
name="email"
formControlName="email"
placeholder="Email"
[(ngModel)]="new_data.email"
class="ml-xs mr-xs"
autocomplete="off">
</md-input-container>
</div>
<button md-raised-button color="primary" type="submit" >Salvar</button>
</div>
<div class="pt-1 pb-1 text-xs-center" fxLayoutAlign="space-between none">
<button type="button" [routerLink]="['/clients/view']" md-button color="default"> Voltar</button>
<span fxFlex></span>
<button md-button color="default">Salvar e Editar</button>
</div>
</md-card-content>
</md-card>
</form>
</div>
</div>
</div>
MEAN:
app/models/client.js
var mongoose = require("mongoose");
var schema = mongoose.Schema({
nome: {
type: String,
},
cpf:{
type: String,
required: true,
},
telefone:{
type: String,
},
email:{
type: String,
},
});
mongoose.model("Client", schema);
app/api/client.js
[.......]
api.adiciona = function(req,res){
model
.create(req.body)
.then(function(q){
res.json(q);
}, function(error){
console.log(error);
res.status(500).json(error);
});
};
[.......]