Question

我根据在HTTP调用期间设置的变量值向HTML显示数据。 HTTP调用不会立即返回数据 - 在设置值（'this.activeEvent'）之前，会先执行一些身份验证步骤。因此，有时我的程序会抛出一个错误，因为'this.activeEvent'仍然为null，即使调用已经发生 - 它还没有返回一个值。如何让我的HTML等到设置值之后？

以下是我订阅的方式：

getActiveEvent（）{ console.log（'主页：getActiveEvent输入...'）;

this._eventService.getActiveEvent()
    .subscribe(res => {
        this.activeEvent = res;
    });

}

这是实际的电话：

getActiveEvent（）{ console.log（'EventService：getActiveEvent enter ...'）;

return this._http.get('/test/events/activeevent')
    .map((response) => {
        console.log(response.json());
        return response.json();
    });

}

这是我的HTML - 它打印了this.activeEvent的字段：

<div class="panel panel-default" style="border-color: #464646;">
    <div class="panel-heading" style="border-color: #BBBBBB; height: 35px; padding-top: 3px;">
        <div style="float: left; margin-top: 5px;">Active Event NAme{{activeEvent.Name}}</div>
    </div>
</div>

Answer 1

仅在定义activeEvent时显示div：

<div *ngIf="activeEvent" ...>

或使用

activeEvent?.Name

使HTML等待来自HttpGet方法的值。

1 个答案: