使用离子列表的ionicframwork的主要详细信息视图

Question

我正在使用离子应用程序，我需要使用主详细信息视图，所以在小屏幕上我显示列表然后当我点击项目转到详细信息（已完成），并且对于更大的屏幕列表与详细信息屏幕并排（检查图像）：

小型设备

更大的设备

如果有人可以帮助我一个想法，或者他知道怎么做，我会很感激。

Answer 1

我不知道如何检查设备的实际尺寸。但是，我知道如何检查屏幕大小，您可以使用$window.innerWidth和$window.innerHeight来完成此操作。

如果您可以找到获取屏幕像素密度的方法，则可以计算屏幕大小，然后根据计算切换视图。您可以在内容上使用ng-if来完成此操作。

你的应用程序在所有手机上看起来都是一样的原因是因为运行离子应用程序的webview组件可以处理所有的屏幕尺寸。