You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
54 lines
1.3 KiB
54 lines
1.3 KiB
4 years ago
|
import { Component, OnInit, Inject, ɵConsole } from '@angular/core';
|
||
|
|
import { HttpClient } from '@angular/common/http';
|
||
|
|
import {MatDialog, MatDialogRef, MAT_DIALOG_DATA} from '@angular/material/dialog';
|
||
|
|
import { MatSnackBar } from '@angular/material/snack-bar';
|
||
|
|
import Swiper from 'swiper';
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
@Component({
|
||
|
|
selector: 'imgdetails',
|
||
|
|
templateUrl: './imgdetails.component.html',
|
||
|
|
styleUrls: ['./allaround.component.scss']
|
||
|
|
})
|
||
|
|
export class ImgDetails {
|
||
|
|
|
||
|
|
constructor(private http:HttpClient,public dialog: MatDialog,public dialogRef: MatDialogRef<ImgDetails>,
|
||
|
|
@Inject(MAT_DIALOG_DATA) public data) { }
|
||
|
|
testSwiper: Swiper;
|
||
|
|
|
||
|
|
ngOnInit(): void {
|
||
|
|
this.allImages = []
|
||
|
|
this.data.forEach(element => {
|
||
|
|
element = `${element}?x-oss-process=image/auto-orient,1`
|
||
|
|
this.allImages.push(element)
|
||
|
|
});
|
||
|
|
}
|
||
|
|
|
||
|
|
ngAfterViewInit() {
|
||
|
|
this.testSwiper = new Swiper('.swiper-container', {
|
||
|
|
lazy: true,
|
||
|
|
direction: 'horizontal',
|
||
|
|
loop: false,
|
||
|
|
|
||
|
|
// 如果需要前进后退按钮
|
||
|
|
navigation: {
|
||
|
|
nextEl: '.swiper-button-next',
|
||
|
|
prevEl: '.swiper-button-prev',
|
||
|
|
}
|
||
|
|
});
|
||
|
|
}
|
||
|
|
|
||
|
|
allImages:any; //展示所有的图片
|
||
|
|
rotationAngle:number=0; //旋转角度
|
||
|
|
|
||
|
|
//旋转图片
|
||
|
|
rotate () {
|
||
|
|
this.rotationAngle = this.rotationAngle+90
|
||
|
|
if (this.rotationAngle === 360) {this.rotationAngle = 0}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
}
|
||
|
|
|