web-dev-qa-db-fra.com

Plusieurs collections dans Angular-in-memory-web-api

Comment créer des collections multiples en utilisant Angular-in-memory-web-api? Pas un problème avec une seule collection. Mais je ne suis pas en mesure de l'implémenter pour plusieurs collections.

Par exemple, je veux créer par exemple deux collections dans la mémoire db - Country et Cities. Une idée, comment faire ça?

angularapiin-memory-database
36
Sparrow

Il suffit de lui renvoyer un objet avec les deux tableaux. Dans l'exemple d'Angular, vous voyez quelque chose comme

createDb() {
  let heroes = [ .. ]
  return { heroes }
}

Si vous ne le savez pas déjà, { heroes } est juste un raccourci pour écrire { heroes: heroes }. Donc, si vous avez deux collections, ajoutez-la simplement comme une autre propriété

createDb() {
  let heroes = [ .. ];
  let crises = [ .. ];
  return { heroes, crises };
  // or { heroes: heroes, crises: crises }
}

Le nom de la propriété retournée sera utilisé pour le chemin d'accès dans l'URL. Vous pouvez donc utiliser

/api/heroes/1
/api/crises/1
60
Paul Samsotha

L'approche décrite dans le réponse de Paul est correcte, mais il y a un détail qui m'a manqué et que j'aime ajouter: Comment spécifiez-vous genId correctement , donc ça marche pour les deux collections?

La réponse se réfère à l'exemple "Heroes" écrit en TypeScript (un sur-ensemble de JavaScript), en particulier le chapitre HTTP . Là, une table heroes est simulée en implémentant:

export class InMemoryDataService implements InMemoryDbService {
  createDb() {
    const heroes = [
      { id: 11, name: 'Mr. Nice' },
      { id: 12, name: 'Narco' },
      // ...
      { id: 20, name: 'Tornado' }
    ];
    return {heroes};
  }

  // Overrides the genId method to ensure that a hero always has an id.
  // If the heroes array is empty,
  // the method below returns the initial number (11).
  // if the heroes array is not empty, the method below returns the highest
  // hero id + 1.
  genId(heroes: Hero[]): number {
    return heroes.length > 0 ? Math.max(...heroes.map(hero => hero.id)) + 1 : 11;
  }
}

Maintenant, si vous ajoutez une 2e collection crises comme indiqué dans sa réponse, à savoir:

createDb() {
  let heroes = [ { ... }, ... ];
  let crises = [ { ... }, ... ];
  return { heroes, crises };
  // or { heroes: heroes, crises: crises }
}

comment fournissez-vous genId pour les deux collections (à condition qu'elles soient de type Hero et Crises)? Surcharge, comme vous le feriez dans C# ne fonctionne pas dans TypeScript, il générerait une erreur ("Implémentation de fonction en double").

Solution: J'ai découvert que vous pouvez résoudre ce problème avec Génériques de TypeScript comme suit. Remplacez la fonction otiginal genId par la version générique suivante:

genId<T extends Hero | Crises>(myTable: T[]): number {
  return myTable.length > 0 ? Math.max(...myTable.map(t => t.id)) + 1 : 11;
}

Ce qui est important ici, c'est la partie <T extends Hero | Crises>: Cela signifie que le type T peut être Hero ou Crises: Il sera donc invoqué si le paramètre transmis est de type Hero[] ou Crises[].

Avec cette connaissance, l'ajout d'une 3e, 4e, ... classe est simple: Ajoutez simplement la classe. Supposons que nous voulions ajouter la classe SuperHero, il vous suffit de l'ajouter via | SuperHero, donc cela ressemblerait à:

genId<T extends Hero | Crises | SuperHero>(myTable: T[]): number {
  return myTable.length > 0 ? Math.max(...myTable.map(t => t.id)) + 1 : 11;
}

Remarque: Comme condition préalable, toutes les classes (Hero, Crises et SuperHero) doivent avoir une propriété numérique id déclarée.

Liens utiles:

13
Matt