*ng如果不工作，只有当离子页面上的东西发生变化时

Question

我在使用“* ngIf”时遇到问题，显然它什么也不做，但是当离子页面上的某些内容发生变化时，例如，当单击输入或屏幕从纵向变为横向时，键盘会显示它显示更改（隐藏/显示) 我做了一个简单的例子：

页面.html

<ion-header>
  <ion-navbar>
     <ion-title>Page</ion-title>
  </ion-navbar>
</ion-header>

<ion-content>
   <div *ngIf="loadingVisible">
      <img src="assets/imgs/example.jpg" alt="">
   </div>

   <button ion-button (click)='showorhide();'>click to show or hide</button>
</ion-content>

页面.ts

import { Component } from '@angular/core';
import { NavController} from 'ionic-angular';


@IonicPage()
@Component({
   selector: 'page-new-table',
   templateUrl: 'new-table.html',
})

export class NewTablePage {

 public loadingVisible:boolean = false;

 constructor(public navCtrl: NavController){

 }

 showorhide(){
    this.loadingVisible = this.loadingVisible ? false : true;
    console.log(this.loadingVisible);
 }
}

我不知道为什么会这样，一些想法？谢谢！

Answer 1

参考@Oscar Bustos 的回答，代码中的实际解决方案是这样的：

  constructor(private cd: ChangeDetectorRef) {}

  refresh() {
    this.cd.detectChanges();
  }

您注入 ChangeDetectorRef，然后在更新变量后调用 detectChanges 方法。