Служба в Angular 2 не сохраняет значения в компоненте html

Question

Я новичок в Angular 2. У меня есть служба, размещенная на моей локальной машине. Сервис отлично работает. Но когда я собираюсь получить данные из службы в моем Angular 2. Как показано ниже: данные были успешно восстановлены и вошли в мою консоль. Но когда я собираюсь показать ценности на мой взгляд. «This.myPurchaseItems» пуст. Почему это? пожалуйста помоги. thanks

calling file...... 
this._service.getMyPracticeTest(this.uid).subscribe(data => { this.myPurchaseItems = data }); 
------------------------------------------------------ 

service.ts file..... 
getMyPracticeTest(uid: string){ 
    return this._http.get('http://localhost:49753/RestServiceImpl.svc/getMyPracticeTest/' + uid) 
     .map(res => res.json()) 
     .do(data => console.log("GetMyPracticeTest" + JSON.stringify(data))) 
     .catch(this.handleError); 
} 
------------------------------------------------------ 

<table class="table"> 
     <tr><th>ID</th></tr> 
     <tr *ngFor="let data of myPurchaseItems"> 
      <td>{{data.Purchase_ID}}</td> 
     </tr> 
</table> 

РЕШЕНИЕ к проблеме.

getMyPracticeTest(uid: string){ 
    return this._http.get('http://localhost:49753/RestServiceImpl.svc/getMyPracticeTest/' + uid) 
    .map(data => { 
     data.json(); 
     // the console.log(...) line prevents your code from working 
     // either remove it or add the line below (return ...) 
     console.log("I CAN SEE DATA HERE: ", data.json()); 
     return data.json(); 
} 

Answer 1

Вам не нужно много ходить здесь, но в последнее время у меня были проблемы с моим *ngFor привязок называть его так, как вы есть. Вместо того, чтобы попробовать этот

<tr *ngFor="let Purchase_ID of myPurchaseItems.data"> 
    <td>{{Purchase_ID}}</td> 
</tr> 

, что сделал это для меня, если это не работает, разместить код для компонента и обслуживания, чтобы мы могли лучше посмотреть на то, что вы делаете.

Answer 2

Ранее у меня была аналогичная проблема, проблема заключалась в том, что обнаружение изменений не запускалось.

Вы можете попробовать это, внутри компонента конструктора

constructor(private cdRef:ChangeDetectorRef) { } 

Внутри вашего блока завершения

this._service.getMyPracticeTest(this.uid).subscribe(data => 
{ 
    this.myPurchaseItems = data; 
    this.cdRef.detectChanges(); 
}); 

ChangeDetectorRef импортируется из @angular/core

Вы можете прочитать больше о ChangeDetectorRefHere