Angular 4-HTML中onInit的打印響應

Question

我在.ts類中具有ngOnInit函數，並且具有與之關聯的html文件。

    ngOnInit() {
//some code
}.then(response => {
          console.log(response.data.reports[0].reportStatus);
         //some other code
})

通常該方法可以正常工作，並且日志可以打印出准確的結果，但是我嘗試了很多事情，但是我不知道如何將響應（及其字段）傳遞給html文件，以便我可以打印出來。 謝謝！

Answer 1

好吧，有幾種方法。 您可能只有一個變量。 例如：

yourVariable: string;

ngOnInit() {
//some code
}.then(response => {
          console.log(response.data.reports[0].reportStatus);
         this.yourVariable = response.data.reports[0].reportStatus;
})

然后在您的HTML中：

<p>My data is: {{ yourVariable }}</p>

Answer 2

這是Angular的基本知識。 提出問題之前，至少應閱讀文檔。

.then(response => {
   console.log(response.data.reports[0].reportStatus);
   this.status = response.data.reports[0].reportStatus;
   //some other code
})

// HTML

<span>{{ status }}</span>

Answer 3

初始化變量dataToDisplay ，將從Promise中分配結果。

  dataToDisplay;  
      ngOnInit() {
    //some code
    }.then(response => {
              console.log(response.data.reports[0].reportStatus);
             this.dataToDisplay = response.data.reports[0].reportStatus;
    })

然后在HTML中像這樣綁定dataToDisplay屬性

<h1 *ngIf="dataToDisplay"> {{dataToDisplay}} </h1>