如何將HTTP JSON響應轉換爲HTML（Ionic2，Angular2，TypeScript，PHP，JSON）？

Question

我目前的工作對我的第一離子2的應用程序，但我還沒有很成打字稿..

我想調用authenticate（）方法在我的構造函數和事後

1. GET整個JSON響應到textarea的 和/或
2. 訪問我的HTML JSON響應的用戶名和密碼值

打字稿：

export class WelcomePage { 
    public data: string; 
    username: string; 
    password: string; 

    constructor(public navCtrl: NavController, public http: Http) { 
     this.authenticate(); 
    }  

    authenticate() { 
      var creds = { username: 'user1', password: 'pw1' }; 

      var headers = new Headers(); 
      headers.append('Content-Type', 'application/x-www-form-urlencoded'); 

      this.http.post('http://www.xyz.api.php', creds, { 
       headers: headers 
      }) 
       .map(res => res.json()) 

       .subscribe(
       data => this.data, 
       err => this.logError(err), 
       () => console.log('Completed') 
       ); 
     } 
} 

響應我已經從API得到：

{ "Person":[ {"Username":"user1","Password":"pw1"} ] } 

HTML：

<textarea>here: {{data}}</textarea> 

- >文本區域爲空

Answer 1

你會想提取裏面的對象陣列，裏面是Person：

.map(res => res.json().Person[0]) // extract object 

此外，你需要將數據分配到this.data像這樣：（連同safe navigation operator?這裏）

.subscribe(
    data => this.data = data // here! 
    .... 

然後使用

{{data?.Username}}和{{data?.Password}}