离子:如何在加载时隐藏元素

时间:2017-09-08 16:33:17

标签: typescript ionic-framework ionic3

app.component.ts

platformReady() {
    // Call any initial plugins when ready
    this.platform.ready().then(() => {
        if(this.platform.is('core')){

            // this.menu.enable(false, 'mobileOnlyPages');
        }else{
            this.splashScreen.hide();
        }
    });
}

app.templates.html

<button ion-item menuClose *ngFor="let p of mobileOnlyPages" (click)="openPage(p)" ngHide="mobile_only">
          <ion-icon item-start [name]="p.icon" [color]="isActive(p)"></ion-icon>
          {{p.title}}
</button>

如何隐藏此按钮?

1 个答案:

答案 0 :(得分:0)

您可以使用:

*ngIf="mobile_only"

或:

[class.hidden]="mobile_only"
样式表上的

.hidden { display: none; }

修改

*ngIf有点:&#34;如果____&#34;

,请渲染此html标记

,而

[class.myClassName]将:&#34;在此html标记上应用类 myClassName ,如果____&#34;

所以基本上可能存在这样一种情况:您实际上需要由于某种原因而呈现的标记,但只是隐藏在用户之外。在这种情况下,使用&#34;条件类&#34;。这不是最好的解释,但我希望这有足够的意义。

这是我所谈论的可能情况的一个例子: Ionic2 button click text box toggle