Ionic 2 - 僅適用於 iPad 啟用朝向

Question

我可以在config.xml中将方向设置为仅纵向，如下所示：

<preference name="Orientation" value="portrait"/>

但是，我怎样才能允许iPad版本的横向，同时仍然禁用iPhone，如上所述？

Answer 1

根据Ionic的Mike Harrison的说法，他说：

除了手动旋转设备，不是真的。这将是 您要为其编写插件以修改主应用程序视图的内容 科尔多瓦

但是有一个 来自 Ionic 1 的插件 .看吧。最终你也可以在Ionic 2中使用它。

使用此插件，您可以执行以下操作：

if(/(ipad)/i.test(navigator.userAgent)) {
//THIS IS THE PLUGIN IONIC 1 CODE 
$scope.changeOriantationPortrait = function() {
screen.lockOrientation('portrait');
}   
}

Answer 2

您可以从配置中删除首选项.xml并通过本机插件定义它 屏幕方向

然后在app.component.ts手机的锁定方向：

// check if platform is not a tablet
if (platform.is('cordova') && !platform.is('tablet')) {
// lock orientation to only portrait mode
this.screenOrientation.lock(this.screenOrientation.ORIENTATIONS.PORTRAIT);
// set screen orientation to 'portrait'
globalProvier.screenOrientation = this.screenOrientation.ORIENTATIONS.PORTRAIT;
} else { // if it's tablet
// set device type to 'tablet'
globalProvier.deviceType = platform.platforms()[3];
// set current orientation type ('portrait-primary' or 'landscape-primary' or 'portrait-secondary' or landscape-secondary)
globalProvier.screenOrientation = this.screenOrientation.type;
// set listener on changing orientation
this.screenOrientation.onChange().subscribe(
() => {
globalProvier.screenOrientation = this.screenOrientation.type;
console.log("Orientation Changed to: ", this.screenOrientation.type);
}
);
}

现在，您可以使用globalProvier.screenOrientation变量根据平板电脑方向动态调整布局。添加类或在模板中使用 *ngIf。

*ngIf='this.globalProvider.screenOrientation == "landscape-primary" || <h3 *ngIf='this.globalProvider.screenOrientation == "landscape-primary" || this.globalProvider.screenOrientation == "landscape-secondary"'>Orientation: landscape</h3>