Comment extraire des valeurs à partir d'une méthode dans Angular ngFor

Question

Je essaie de mettre en œuvre un menu déroulant en utilisant la méthode mais cela renvoie vide. Si j'essaie de le mettre à l'intérieur de ngOninit je perds mes valeurs de routeur snapshot et ne peux pas renvoyer de résultat 200. Je l'ai mis à l'intérieur du constructeur et cela renvoie des valeurs mais je perds à nouveau mes valeurs.

J'ai obtenu un résultat comme ceci (fonctionne bien) :

 [{"hypervisorName":"Steve","hypervisorId":1},{"hypervisorName":"Docker","hypervisorId":2}, 
   {"hypervisorName":"kubernetes","hypervisorId":3}]

Ma méthode côté back-end :

 [HttpGet("hyperforvm")]
 public IActionResult GetHypervisorsForVm()
 {
        var model = from hyper in _context.Hypervisors
                   select new 
        { HypervisorName = hyper.Name, HypervisorId = hyper.HypervisorId };
          return Ok(model);
 }

Mon composant :

export class AddVmComponent implements OnInit {
  model: any = {};
  disabledProperty: boolean = true;
  items: any;

  constructor(private alertify: AlertifyService, private vm: VmService, private route: 
   ActivatedRoute, private http: HttpClient) {
    this.items = this.getHyper()
  }

  ngOnInit() {
    let projectId = +this.route.snapshot.paramMap.get('projectId')
    this.model.projectId = projectId
    this.model.managementId = 1    
  }

  getHyper() {
    this.vm.getHypervisorsForVm().subscribe(h => this.model = h)
  }  
}

Mon Html ressemble à ceci :

           Hyperviseur

       -Veuillez choisir un hyperviseur-

        {{ item.hypervisorName }}

La situation est que j'ai besoin de sauvegarder hypervisorId dans la base de données et de montrer hypervisorName dans le menu déroulant (le backend est ok testé avec postman tout est ok). Les problèmes sont que peu importe si je mets à l'intérieur de constructeur ou de ngOninit, je perds mes valeurs snapshot. À l'intérieur du constructeur, la méthode getHyper() renvoie le résultat mais à l'intérieur de ngOninit non. Mais dans les deux cas, les valeurs ne s'affichent pas dans le menu déroulant. Comment montrer hypervisorName, sauvegarder hypervisorId et ne pas perdre les valeurs snapshot.

Answer 1

Vous devriez faire un effort pour supprimer tous types, cela vous aidera grandement à trouver des bugs!.

Cela dit, vous pouvez essayer ceci:

export interface Hyperviseur {
  nomHyperviseur: string;
  idHyperviseur: number;
}

export interface GestionProjet {
  idProjet: number;
  idGestion: number;
}

export class AjouterComposantVm implements OnInit {
  hyperviseurs$: Observable;
  proprieteDesactivee: boolean = true;
  modele: GestionProjet;

  constructor(
    private alertify: AlertifyService,
    private vm: ServiceVm,
    private route: ActivatedRoute,
    private http: HttpClient)
  {
    this.hyperviseurs$ = this.vm.getHyperviseursPourVm();
  }

  ngOnInit() {
    this.modele.idProjet = +this.route.snapshot.paramMap.get('projectId');
    this.modele.idGestion = 1;
  }
}

           Hyperviseur

       -Veuillez choisir un hyperviseur-

        {{ item.nomHyperviseur }}

Answer 2

J'ai changé mon HTML et ça fonctionne bien maintenant :

           Hyperviseur

       -Veuillez choisir un hyperviseur-

        {{ item.hypervisorName }}