2016-06-23 3 views
1

Я тестирую angular2 и пытаюсь извлечь данные из службы отдыха.Angular2 http json request

Моя служба, как это:

import {Injectable} from '@angular/core'; 
import {Http, Response} from '@angular/http'; 
import {annuaireModel} from '../../models/annuaireModel'; 
import {Observable} from 'rxjs/Observable'; 
import 'rxjs/Rx'; 

@Injectable() 
export class annuaireService { 

    constructor(private _http: Http) { }; 

    getAnnuaire(codeRne : string) { 

      var url = 'http://192.168.40.30/api/editionsstandardsAPI/lireannuaire?codeEtablissement=' + codeRne ; 
     return this._http.get(url).map(res => <annuaireModel>res.json()).catch(this.gestErreur); 
    } 

    gestErreur(error: Response) { 
     console.error(error); 
     return Observable.throw(error.json() || 'Erreur serveur'); 
    } 
    /*getHero(id: number) { 
     return Promise.resolve(HEROES).then(heroes => heroes.filter(hero => hero.id === id)[0]); 
    }*/ 
} 

Мой компонент:

import {Component} from '@angular/core'; 
import {HTTP_PROVIDERS} from '@angular/http'; 
import {annuaireService} from './annuaireService'; 
import {annuaireModel} from '../../models/annuaireModel'; 

@Component({ 
    templateUrl: 'app/editionsStandards/annuaire/annuaire.html', 
    selector: 'annuaire', 
    directives: [], 
    providers: [HTTP_PROVIDERS,annuaireService] 
}) 

export class annuaireComponent { 

     annuaire : annuaireModel; 
     variableTest : string; 

    constructor(private _annuaireService :annuaireService) { } 

    ngOnInit() { 

     } 

     chargerAnnuaire() { 
      this._annuaireService.getAnnuaire('7508987231').subscribe(
          data => 
          {this.annuaire = data} , 
          error => alert(error), 
          () => console.log('OK') 
         ); 


    } 
} 

Мой HTML:

<h1>Annuaire</h1> 
<button (click)="chargerAnnuaire()" type="button">test</button> 
<div > 
    {{annuaire.entete.raisonSociale}} 
</div> 

Когда я запускаю сайт, у меня есть эта ошибка:

cannot read the property entente of undefined.

Я проверил мою успокоительную службу и делает вернуть слизи .... JSON

Помощь! Я не могу понять, что я делаю неправильно. Благодаря

ответ

2

Попробуйте Elvis оператор ?.

{{ annuaire?.entete.raisonSociale }} 

В случае annuaire является falsy (не определено, нуль и т.д.), не будет доступа entete члена.

+0

Вам также может понадобиться оператор 'Elvis' для' entete'. – enjoibp3

+0

ты абсолютно прав! Я написал это: {{annuaire? .entete? .raisonSociale}}, и он отлично работает. я уже пробовал оператор elvis, но на первом элементе только не второй. много благодарностей andrei –