Как проложить обратную страницу - Модуль Ionic 4 Angular Router - PullRequest
Новая
       29

Как проложить обратную страницу - Модуль Ionic 4 Angular Router

0 голосов
/ 22 апреля 2019

У меня есть страница камеры, которая загружается другими страницами в моем приложении. Эта страница содержит функции предварительного просмотра камеры ( camera.ts ):

// camera.ts 

import { Component, OnInit } from '@angular/core';
import {CameraPreview, CameraPreviewOptions, CameraPreviewPictureOptions} from '@ionic-native/camera-preview/ngx';
import {Platform} from '@ionic/angular';
import {GlobalDataService} from '../../../services/global-data.service';
import {Router} from '@angular/router';

@Component({
  selector: 'app-camera',
  templateUrl: './camera.page.html',
  styleUrls: ['./camera.page.scss'],
 })
export class CameraPage implements OnInit {

  cameraPreviewOpts: CameraPreviewOptions = {
    x: 0,
    y: 0,
    width: window.screen.width,
    height: window.screen.height,
    camera: 'rear',
    tapPhoto: true,
    previewDrag: true,
    toBack: true,
    alpha: 1
   };
   // picture options
   pictureOpts: CameraPreviewPictureOptions = {
    width: 1280,
    height: 1280,
    quality: 85
   };

 constructor(private  router: Router, private cameraPreview: 
      CameraPreview, public platform: Platform, private globalDataService: 
       GlobalDataService) {
         // solve the problem - "plugin not installed".
         platform.ready().then(() => {
         this.openCamera();
      });
  }

selectedImage: any;
  ngOnInit() {
}

openCamera() {
    console.log('open camera');
    // start camera
      this.cameraPreview.startCamera(this.cameraPreviewOpts).then(
        (res) => {
      console.log('cameraPreview.start');
      console.log(res);
    },
    (err) => {
      console.log('cameraPreview.start fails');
      console.log(err);
    });
}

takePicture() {
  console.log('take pinture');
  // take a picture
  this.cameraPreview.takePicture(this.pictureOpts).then((imageData) => {
    this.selectedImage = 'data:image/jpeg;base64,' + imageData;
    console.log('take picture ');
    this.globalDataService.changePictureTaken(this.selectedImage);
    // replace with router to the back page
    // this.router.
  }, (err) => {
    console.log(err);
    this.selectedImage = 'assets/img/test.jpg';
  });
}
cerrarCamara() {
     this.cameraPreview.stopCamera();
}
}

Чтобы объяснить лучше, есть пример для 3 страниц:

1 - Страница камеры

2 - Страница A

3 - Страница B

Страница A загружает камеру с помощью модуля маршрутизации: 

this.router.navigateByUrl('/camera');

И страница B делает то же самое (не одновременно): 

this.router.navigateByUrl('/camera');

В коде camera.ts , после съемки (метод takePicture () ) я хочу вернуться на страницу, которая раньше вызывала эту страницу, я хочу сделать то же самое действие, которое происходит при удерживании задней кнопки телефона.

Например, если страница A перейдет на camera , однажды на странице камеры я сделаю снимок, а затем я хочу перенаправить свое приложение обратно в A. И если страница B перейдет на camera , попав на страницу камеры, я сделаю снимок, а затем перенаправлю свое приложение обратно в B.

Я имею в виду, что я не хочу делать router.navigateByUrl , потому что я не всегда хочу маршрутизировать одну и ту же страницу, но это всегда задняя страница.

Есть ли способ сделать это в машинописи?

1 Ответ

2 голосов
/ 22 апреля 2019

Вы можете использовать location.back () для перехода на последнюю страницу. 

import {Component} from '@angular/core';
import {Location} from '@angular/common';

@Component({
  selector: 'app-camera',
  templateUrl: './camera.page.html',
  styleUrls: ['./camera.page.scss'],
 })
class CameraPage {

  constructor(private location: Location) 
  {}

  onBackClicked() {
    this.location.back();
  }
}
...