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>