【问题标题】：Ionic 4 showWhen hideWhenIonic 4 showWhen hideWhen
【发布时间】：2019-04-14 09:28:44
【问题描述】：

我正在尝试对 Web 和设备使用相同的 html，并且在某些情况下我需要显示/隐藏 Web html 或设备 html。

Ionic 4 中的 showWhen 和 hideWhen 指令在哪里？如果它们消失了，它们是否被其他东西取代了？

到目前为止，我只能找到some test page，但这并不能说明什么。

【问题讨论】：

标签： html ionic-framework angular-directive ionic4

【解决方案1】：

为了将我的应用升级到 ionic 4，我使用了这个替代方案 https://ionicframework.com/docs/utilities/platform 来根据设备的操作系统显示正确的按钮，它工作得很好并且很容易实现：

import { Component, OnInit} from '@angular/core';
import { Platform } from '@ionic/angular';

@Component({
  selector: 'update-password',
  templateUrl: './update-password.component.html'
})
export class UpdatePasswordComponent implements OnInit {

  constructor(
    public platform: Platform
  ) { }

<ion-header>
  <ion-toolbar>
    <ion-title>Update Password</ion-title>
    <ion-buttons slot="start">
      <ion-button (click)="dismiss()">
        <ion-text color="primary" *ngIf="platform.is('ios')">Cancel</ion-text>
        <ion-icon name="md-close" *ngIf="!platform.is('ios')"></ion-icon>
      </ion-button>
    </ion-buttons>
  </ion-toolbar>
</ion-header>

【讨论】：

【解决方案2】：

是的，Ionic 4 有这些指令；

ion-hide-when

和

ion-show-when

例如，如果您只想在 android 中显示；

<ion-show-when platform="android"> stuff </ion-show-when>

更新

显然，这些指令刚刚从最后一个 beta 版本的 Ionic 4 中删除。看到这个link

【讨论】：

Angular 抱怨 'ion-show-when' is not a known element。您有文档或其他来源的链接吗？
嗨！你说的对。显然，这些指令刚刚在最后一个 beta 版本中从 Ionic 4 中删除。看到这个link

【解决方案3】：

有一个 Ionic 4 代码笔 here，它展示了如何实现与删除的带有样式的指令相同的效果，例如此跨度将仅在 iOS 上显示。

<span class="hide show-ios">Show iOS</span>

【讨论】：