mardi 24 juillet 2018

How to properly read a value from a JSON in Angular 6

I despair again and simply cannot reach a result, because everyone has this problem in a different context.

I am trying to load a value from a JSON response object and output it into an html input field. The problem is, however, that the value I load is always defined as 'undefined' by the console.

So my question now is: how do I properly read a value from a JSON object?

The method affected is the updateEinsatzort()

Notice: I am totally new to WebDevelopment and TypeScript.

Component.ts

import { Component, OnInit } from '@angular/core';
import { EinsatzorteService } from '../einsatzorte.service'
import { EinsatzortModel } from '../einsatzortmodel'
import { NgForm } from '@angular/forms';

@Component({
  selector: 'app-einsatzorte',
  templateUrl: './einsatzorte.component.html',
  styleUrls: ['./einsatzorte.component.css']
})
export class EinsatzorteComponent implements OnInit {

  einsatzorte$: Object;
  model = new EinsatzortModel(null,'','','','','','','','','','');
  einsatzortObjekt$: EinsatzortModel;

  constructor(private einsatzorte: EinsatzorteService, private einsatzorteServ: EinsatzorteService) { }

  ngOnInit() {
    this.einsatzorte.getEinsatzorte().subscribe(
      einsatzorte => this.einsatzorte$ = einsatzorte
    )
  }

  newEinsatzort(form: NgForm) {

    var einsatzortObjekt={
      institutionsart: form.value.institutionsart,
      name: form.value.name,
      adresse: form.value.adresse,
      plz: form.value.plz,
      stadt: form.value.stadt,
      land: form.value.land,
      tel: form.value.tel
    }

    this.einsatzorte.createEinsatzorte(einsatzortObjekt).subscribe(
      (response) => {console.log(response);}
    );


  window.location.reload()

  }


  deleteEinsatzort(id): void{
    this.einsatzorte.deleteEinsatzort(id)
    .subscribe(dataErsatz => {
      this.einsatzorte$ = this.einsatzorte$;
    })

    window.location.reload()
  }

  updateEinsatzort(id: number, einsatzort: EinsatzortModel){
    this.einsatzorteServ.readEinsatzort(id, einsatzort).subscribe(
      updateObjekt => {
        this.einsatzortObjekt$ = this.einsatzortObjekt$;
        console.log(updateObjekt) // Gives me whole object with correct values
        console.log() //<<<<===== here I want to have the <<name>> attribute of this value
      }
    )
  }

}

Model

export class EinsatzortModel {

    constructor(

    public id:number,
    public institutionsart: string,
    public name: string,
    public adresse: string,
    public plz: string,
    public stadt: string,
    public land: string,
    public ansprechpartner: string,
    public tel: string,
    public mobil: string,
    public mail: string

    ){}
}




Aucun commentaire:

Enregistrer un commentaire