2017-04-07 2 views
0

Nous avons une application Angular avec un formulaire d'édition pour un modèle appelé Rule. Cela a des champs pour Nom, Description et ainsi de suite, qui sont toutes les entrées de texte. Ensuite, il existe un modèle RuleType qui est une relation appartenant au modèle Rule. Nous aimerions implémenter ceci sous la forme d'un menu déroulant de RuleTypes lors de la modification de la Règle. Ces RuleTypes seraient chargés à partir de la base de données via AJAX (donc pas codé en dur dans l'application Angular).Gestion des relations d'édition dans Angular

Le modèle de règle JSON renvoyé par l'API ressemble actuellement à ce qui suit. Cela peut être modifié si nécessaire

{ 
    "name": "TestRule", 
    "description": "This is a rule", 
    "ruleTypeId": 2, 
    "ruleType": { 
     "id": 2, 
     "name": "Instant", 
     "key": "INSTANT" 
    } 
} 

Les deux façons, j'ai pensé à aller chercher les données pour le menu déroulant est le suivant:

  • Mettre en oeuvre un appel API pour récupérer toutes les RuleTypes. carte Ensuite cela dans le menu déroulant, puis sélectionnez celui applicable en fonction de la zone « ruleTypeId » sur le modèle de la règle
    • PROS: Est-ce une approche générique qui correspond à la conception de l'API
    • CONS: Nécessite une requête HTTP supplémentaire et logique manuelle pour élaborer l'élément sélectionné
  • Renvoyer une liste de tous les RuleTypes dans le cadre de l'appel d'API pour extraire les règles.
    • PROS: Ne nécessite qu'un seul appel API
    • CONS: ajoute des données supplémentaires à l'appel de l'API pour récupérer des règles. Ne convient pas bien avec la conception de l'API REST

Quelle est la meilleure pratique/approche plus propre pour elle aller chercher ces données et la cartographie aux modèles/vue dans angulaire?

Répondre

0

Géré pour résoudre ceci d'une manière agréable en chargeant les RuleTypes via une requête Ajax séparée dans le contrôleur. Ceci est ensuite utilisé pour remplir la liste déroulante à l'aide de la directive ngOptions. La directive ngModel gère la sélection de l'élément correct en fonction de ruleTypeId. Ceci est ensuite sauvegardé en utilisant Ajax lorsque le modèle de règle est enregistré.

De cette manière, aucune intervention manuelle n'était nécessaire, à part le chargement des données déroulantes via Ajax.