angular - 可以使用 Ionic 2 更改手机和平板电脑的布局吗？

Question

我看到 Ionic 2 有一个响应式网格系统，但它似乎只能让您创建网格样式布局。

我正在寻找能让我在平板电脑上以一种方式显示 View ，在手机上以另一种方式显示 View 的东西。在这个特定的例子中，我有一份工作 list 。如果是平板电脑，我还想在列表右侧显示 map 并将其绘制出来。如何制作我理解的 map ，但我如何知道他们正在使用什么并显示正确的 UI？

Answer 1

您可以使用 platform information 来决定布局的显示方式。 :

Platform Name   Description
android on a device running Android.
cordova on a device running Cordova.
core    on a desktop device.
ios on a device running iOS.
ipad    on an iPad device.
iphone  on an iPhone device.
mobile  on a mobile device.
mobileweb   in a browser on a mobile device.
phablet on a phablet device.
tablet  on a tablet device.
windows on a device running Windows.

通过使用底层的 platform 信息，如果它是 tablet(或 ipad)，您可以通过简单地执行以下操作来显示或隐藏内容:

this.isTabletOrIpad = this.platform.is('tablet') || this.platform.is('ipad');

然后通过使用 *ngIf 或您在 View 中需要的任何内容，或使用 isTabletOrIpad 属性来决定是否初始化 map 。