Question

我有一个视频用作移动设备的背景，以显示手机旋转（某种）时的反应动画，但是当旋转需要它从头到尾循环或从头开始时循环播放不会循环播放，我也不知道为什么要将它设置为应该起作用的值。

此功能可订阅陀螺仪并通过一些数学运算来更新角度

    this.gyroscope.watch(this.options)
    .subscribe((orientation: GyroscopeOrientation) => {
        // need delta time to correctly calculate angle per update
        this.time.now = new Date().getTime();
        this.time.delta = this.time.now - this.time.last;

        if (this.videoLoaded) {

            // convert radians/sec to degree/sec and times by deltaTime
            const degree = 180 / Math.PI * orientation.z;
            this.targetAngle -= (this.time.delta / 1000) * degree;

            // lerp target angle no clipping applied
            this.angle = (1 - .1) * this.angle + .1 * this.targetAngle;

            // convert lerped angle into clipped 0-360
            let displayAngle = this.angle % 360;
            if (displayAngle < 0) { displayAngle = 360 + displayAngle; }

            // convert angle to time of video round to tenths dec
            this.frame = Math.round((displayAngle * this.axeVideo.duration / 360) * 10) / 10;

            // set video time
            this.axeVideo.currentTime = this.frame;
        } else {
            // clear angle as gyro spits out large values at first
            this.angle = this.targetAngle = 0;
        }
        // update last time for deltaTime calc
        this.time.last = this.time.now;
    });

这都是正确的数学运算，并且在逻辑上是可行的，但是，当测试视频时，无论手机旋转了多少圈并锁定并且“解锁”它，我都必须将手机旋转相同的角度。

Screen Capture of issue的录制有点慢，但通常超级流畅（因此，为什么要使用此解决方案）。

Answer 1

在ion-range上带有[（ngModel）]的内容会覆盖设置的时间。

HTML视频currentTime设置不正确

1 个答案: