html - 为什么 angular2 ngIf 在 HTML 文件中不起作用？

Question

我在我的项目上工作，并从 .ts 文件中设置了一个标志，但<div>尽管值正确，但它并没有隐藏标签。

HTML 文件：

<div *ngIf="this.isPickupOrderAvaliable">
    <button 
    class="btn btn-primary pickup-order-button"
    data-toggle="modal"
    data-target="#pickupOrderModal">! PickupOrderButton !</button>
</div>

{{this.isPickupOrderAvaliable}}

.ts 文件，其后调用

submitPickupOrder() {
  if (this.pickupOrderForm.invalid) {
    console.log('this.form is invalid');
  }

this.http.post(`${appConfig.HostUrl}dashboardservice/PickupOrder/`, 
  this.pickupOrderForm.getRawValue()).subscribe((x: any) => {
    this.isPickupOrderAvaliable = x._body;
    console.log(`this.isPickupOrderAvaliable: ${this.isPickupOrderAvaliable}`);
});
}

在下图中，false 显示 的值this.isPickupOrderAvaliable，但按钮仍然可见。

你知道我在这段代码中哪里出错了吗？

标签： htmlangular

Answer 1

尝试打印的值 x._body并检查它的真假。如果为真，则显示该按钮，如果为假，则隐藏该按钮。在ts文件中设置默认值为false