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
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} |
|
} |
|
|
|
|
|
|
|
} |
|
|