angular y graphql
Publicado por Noah (1 intervención) el 06/11/2020 03:47:49
Hola quiero mostrar un data en angular como resultado de una mutación de graphql
![angular-graphql](/usr/361000/361690/5fa4b90b1274e-angular-graphql.png)
este el el data que quiero mostrar en un messageService de angular
alguien que me ayude el parte de mi examen de ciclo.
gracias....
este es mi código
![angular-graphql](/usr/361000/361690/5fa4b90b1274e-angular-graphql.png)
este el el data que quiero mostrar en un messageService de angular
alguien que me ayude el parte de mi examen de ciclo.
gracias....
este es mi código
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
import { Component, OnInit, Output, EventEmitter } from '@angular/core';
import { Apollo } from 'apollo-angular';
import { Subscription } from 'rxjs';
import { Pais, PaisQuery } from '../../types/Pais';
import { getPaisQuery, createPais } from '../../Query/queries';
import { ConfirmationService } from 'primeng/api';
import { MessageService } from 'primeng/api';
@Component({
selector: 'app-posts',
templateUrl: './posts.component.html',
styleUrls: ['./posts.component.scss'],
providers: [MessageService, ConfirmationService],
})
export class PostsComponent implements OnInit {
private querySubscription: Subscription;
getpais: Pais[];
pais: Pais;
paisactivo: boolean;
message: string;
@Output()
paisSelected = new EventEmitter<Pais>();
constructor(
private apollo: Apollo,
private messageService: MessageService,
private confirmationService: ConfirmationService
) {}
ngOnInit() {
/*Inicamos el proceso para que liste los paises cuando se inicie la pagina */
this.listarPias();
}
/*Funcion listar Paises */
listarPias() {
this.querySubscription = this.apollo
.watchQuery<PaisQuery>({
query: getPaisQuery,
})
.valueChanges.subscribe(({ data }) => {
this.getpais = data.getpais;
});
}
/*Fin listar Paises */
display: boolean = false; // Inicamos en modal en false
submitted: boolean; /// inciamos el compnenetes sumbmitted en falso
/*Realizamos la funcion de mostar el modal */
showDialog() {
this.pais = {};
this.display = true;
this.submitted = false;
}
/*Realizamos la funcion para cerrar el modal */
hideDialog() {
this.display = false;
this.submitted = false;
}
/*Realizamos la funciona de editar pais y cargamos el pais a modificar */
editPais(pias: Pais) {
console.log(pias);
this.pais = { ...pias };
this.display = true;
}
/*FUNCIONA CREAR PAIS */
createPais() {
this.submitted = true;
this.paisactivo = true;
if (this.pais.pais_descripcion != null) {
this.apollo
.mutate({
mutation: createPais,
variables: {
pais_descripcion: this.pais.pais_descripcion,
pais_active: this.paisactivo,
},
refetchQueries: [
{
query: getPaisQuery,
},
],
})
.subscribe(({ data }) => {
console.log('data', data);
});
this.hideDialog();
} else {
this.messageService.add({
severity: 'error',
summary: 'Error',
detail: 'Debe llenar todos los campos requeridos',
life: 3000,
});
}
}
}
Valora esta pregunta
![Me gusta: Está pregunta es útil y esta clara Me gusta: Está pregunta es útil y esta clara](/img/img.png?11.51)
![NO me gusta: Está pregunta no esta clara o no es útil No me gusta: Está pregunta no esta clara o no es útil](/img/img.png?11.51)
0