Ionic 2 - 仅适用于iPad的横向打印

Question

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

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

但是，我如何允许iPad版本的横向定位，同时仍然禁用iPhone如上所述？

Answer 1

据Ionic的Mike Harrison说，他说：

除了手动旋转设备，不是真的。这将是您编写用于修改cordova中的主App视图的插件

但是有一个Plugin from 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

您可以从config.xml中删除首选项，并通过本机插件Screen Orientation进行定义

然后在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>