Angular2 objet ne peut pas définir la propriété de undefined

J'ai donc ce petit soft en Angular2, et je suis en train de définir un objet. C'est le composant principal.

export class ContactComponent  {
    person: {
    firstname: string;
    lastname: string;
}
constructor(private PeopleService: PeopleService){
}

ngOnInit(){

this.PeopleService.fetchData().subscribe(
    data=> {
        this.person.firstname=data.results[0].name.first;
        console.log(this.person.firstname);
    });
  }
}

Puis dans le journal de la console j'obtiens:

Impossible de définir la propriété "prenom" undefined

Je ne peux pas le comprendre. Merci.

OriginalL'auteur raulnoob | 2017-03-21

  1. 10

    Vous êtes juste de définir le type de person ici (le côlon, des stands pour les annotations de type eg:propertyName:Type) :

    person: {
    firstname: string;
    lastname: string;
}

    Vous devez attribuer une valeur première, sinon, il sera undefined

    interface Person {
    firstname ? : string; //the "?" makes the property optional, 
    lastname ? : string; // so you can start with an empty object
}
export class ContactComponent {

    person: Person = {}; //initializing with an empty object

    constructor(private PeopleService: PeopleService) {}

    ngOnInit() {

        this.PeopleService.fetchData().subscribe(
            data => {
                this.person.firstname = data.results[0].name.first;
                console.log(this.person.firstname);
            });
    }
}
    Merci! Ça fonctionne très bien!
    Vous pouvez prendre un coup d'oeil sur ce gyazo.com/2ef08d144e87fc28f83fbfe83d974bf3, j'obtiens 50 résultats de la requête http, mais la deuxième console.journal [1] ne fonctionne pas. aucune idée pourquoi? C'est la même erreur " impossible de définir...'
    omg, vous avez besoin pour remplir votre tableau, vous avez l'habitude de créer manuellement chaque entrée...
    bien sûr, je ne vais pas créer manuellement chaque entrée, je voulais juste vérifier si cela fonctionne, j'ai aussi essayé avec un pour
    this.person=data.results.map(()=>{firstname:item.name.first,lastname:item.name.last}) Mais je veux dire, si vous avez des problèmes de ce genre, vous ne devriez probablement pas avoir commencé avec angulaire 2, peut-être quelque chose de plus simple pour un débutant angulaire 2 de la courbe d'apprentissage est raide.

    OriginalL'auteur n00dl3

  2. 0

    Créer une classe et d'héritage dans le composant. Voir, par Exemple, le code ci-dessous

           export class Person{

            firstname: string;
            lastname: string;
        }
        export class ContactComponent  {
        person=Person[];
        constructor(private PeopleService: PeopleService){
        }

        ngOnInit(){

        this.PeopleService.fetchData().subscribe(
            data=> {
                this.person.firstname=data.results[0].name.first;
                console.log(this.person.firstname);
            });
          }
        }
    il n'y a pas d'héritage implicite ici...

    OriginalL'auteur Venkateswaran R