web-dev-qa-db-fra.com

Plusieurs objets dans HttpParams

J'ai quelques catégories dans un formcontrol, je les envoie dans un tableau de chaînes comme ceci:

[1,4,6]

Et c'est mon code réel:

let categoryIds = new Array<String>()
this.selectedCategories.forEach((value: string, key: string) =>
  categoryIds.Push(key))

let requestOptions = {
    params: new HttpParams()
        .set('title', this.createNewForm.controls['title'].value)
        .append('content', this.createNewForm.controls['content'].value)
        .append('categoryids', categoryIds.toString()),              
    withCredentials: true
}

Mais je veux les envoyer sous forme de tableau d'objets, avec l'ancienne version de angular Http j'ai pu faire un foreach de l'objet et ajouter chaque catégorie. Mais je ne sais pas comment pour obtenir chaque catégorie et faire de chacune une annexe aux paramètres. Je dois obtenir comme ceci:

... categoryId = 1 & categoryId = 4 & categoryId = 6 ...

6
Juanker

Vous pouvez utiliser .append Pour ajouter des valeurs à un paramètre et vous donner le résultat que vous recherchez lorsque vous traitez un tableau de valeurs. .set Est utilisé pour définir ou remplacer une valeur pour un paramètre. Donc, vous devriez vraiment faire quelque chose de plus comme ceci:

let httpParams = new HttpParams()
  .set('title', this.createNewForm.controls['title'].value)
  .set('content', this.createNewForm.controls['content'].value);

categoryIds.forEach(id => {
  httpParams = httpParams.append('categoryId', id);
});

const requestOptions = {
  params: httpParams,
  withCredentials: true
};

Ce n'est pas évident, mais la méthode .append Ne mute pas l'objet HttpParams à partir duquel elle a été appelée mais renvoie à la place un nouvel objet. C'est pourquoi nous réaffectons httpParams dans l'exemple ci-dessus. De plus, .append Peut être appelé sans utiliser au préalable .set Pour définir le paramètre.

16
Rich McCluskey

Vous pouvez créer un objet contenant tous les paramètres et passer cet objet à la propriété fromObject de HttpParamOptons tout en créant HttpParams

let data={
   firstname:'xyz',
   lastname:'pqr'
}

let body=new HttpParams({fromObject:data})

this.http.post(URL, body, this.header).subscribe(data => {
 ....
}, error => {
 ....
})
8
Altaf Shaikh

C'est peut-être ce que vous cherchez

fichier composant:

import { Component } from '@angular/core';
import { HttpParams } from '@angular/common/http';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})

export class AppComponent {

data = [
       {id:'_', title:'_', content:'_'},
       ....,
       ....
       ];

mainArr:any = [];

constructor(){}

getCategory(item){
    this.mainArr.Push({title:item.title,content:item.content,categoryId:item.id});

   console.log('mainArr',this.mainArr);

   let requestOptions = {
        params: new HttpParams()
        .append('data', this.mainArr),
        withCredentials: true
    }

   console.log('requestOptions',requestOptions);
  }
}