2017-08-31 60 views
2

從JSON數據我有這樣一個JSON響應。如何獲得Angular2

{ 
    "response": { 

     "my_students": { 
      "students": [ 
       { 
        "studentNumber": "123", 
        "studentName": "ABC" 

        "studentaddresse": [ 
         { 

          "address": "test" 

         } 
        ] 

       }, 
       { 
        "studentNumber": "345", 
        "studentName": "CDS" 

        "studentaddresse": [ 
         { 

          "address": "test1" 

         } 
        ] 

       } 
      ] 
     } 
    } 
} 

按鈕點擊我必須獲取這些數據。 對於在component.ts文件,我有這樣的代碼

studdata=[]; 
ngOnInit(){ 
     this.studdata= this.studentService.loadStudents(); 
} 

而且在student.service.ts文件,我有這樣的代碼

loadStudents(): any{ 
     return this.loginService.getStudentData(); 
    } 

而且在login.Service.ts文件我有這樣的代碼 //在按鈕點擊我打電話getStudentResponseData()這種方法 在控制檯我得到d ata.but在getStudentData()方法不是在獲取數據

student_data: Object; 

    public getStudentResponseData() : Promise<any> { 
      if(typeof(this.student_data) === "undefined") { 
       return this.http.get('assets/studentapi.json') 
       .toPromise().then(res => { 

             this.student_data = res.json().response; 
         console.log("data"+this.student_data);     
             return this.student_data; 
        }).catch(this.handleError); 
      } else { 
       return Promise.resolve(this.student_data); 
      } 
    } 
    public getStudentData(): Object { 
      return this.student_data; 
     } 

任何人都可以請幫我這個,我哪裏做錯了嗎? 而我想在HTML中顯示值,如何在這裏顯示學號。

<div *ngFor="let stu of studdata"> 
<div>{{stu.studentNumber}}</div> 
</div> 
+0

你爲什麼不直接調用登錄服務?學生服務對我來說似乎沒有必要。 –

+0

如果我直接調用會隨後還我沒有得到數據。@ D.Simon – ananya

回答

1

因爲這種方法是異步的。你可以得到的數據在.Promise().then (... you can handle data here ...)

由於方法的異步,你不能從getStudentData()函數獲取數據。

+0

你可以看到無極的使用和解決鏈接https://stackoverflow.com/questions/14220321/how-do-i異步方法-return最響應從 - 一個異步呼叫/ 14220323#14220323 – RTE

2

loadStudents()返回的承諾。所以在你的組件中代碼必須是這樣的:

ngOnInit(){ 
     this.studentService.loadStudents() 
      .then((students) => { 
       this.studdata = students; 
      }); 
} 
+0

我試圖這樣also.But事情是數據沒有來到這個方法@ D.Simon 公共getStudentData():對象{ 返回this.student_data; } – ananya