mirror of https://github.com/Nofated095/Dress.git
查看图片后退滚动条位置改变问题
This commit is contained in:
parent
dd7a61c555
commit
8396ceb053
|
@ -15,7 +15,7 @@ const routes: Routes = [
|
|||
];
|
||||
|
||||
@NgModule({
|
||||
imports: [RouterModule.forRoot(routes)],
|
||||
imports: [RouterModule.forRoot(routes, {scrollPositionRestoration: 'enabled'})],
|
||||
exports: [RouterModule]
|
||||
})
|
||||
export class AppRoutingModule {}
|
||||
|
|
|
@ -28,7 +28,7 @@
|
|||
<span>dress</span>
|
||||
</mat-toolbar>
|
||||
<!-- Add Content Here -->
|
||||
<router-outlet></router-outlet>
|
||||
<router-outlet ></router-outlet>
|
||||
</mat-sidenav-content>
|
||||
</mat-sidenav-container>
|
||||
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
<div id="wrapper">
|
||||
<mat-toolbar color="primary">
|
||||
<button type="button" mat-icon-button (click)="location.back()">
|
||||
<button type="button" mat-icon-button (click)="goBack()">
|
||||
<mat-icon>arrow_back</mat-icon>
|
||||
</button>
|
||||
<span></span>
|
||||
|
|
|
@ -57,7 +57,13 @@ export class PhotoComponent {
|
|||
private breakpointObserver: BreakpointObserver,
|
||||
public location: Location,
|
||||
private ref: ChangeDetectorRef
|
||||
) {}
|
||||
) {
|
||||
this.location = location;
|
||||
}
|
||||
|
||||
goBack() {
|
||||
this.location.back()
|
||||
}
|
||||
|
||||
async load() {
|
||||
this.ref.markForCheck();
|
||||
|
|
|
@ -4,7 +4,7 @@
|
|||
<span class="author">{{commit.username}}</span>
|
||||
<span class="message" *ngIf="commit.message">{{commit.message}}</span>
|
||||
</h4>
|
||||
<a *ngFor="let file of commit.files" [routerLink]="file">
|
||||
<a *ngFor="let file of commit.files" [routerLink]="file" (click)="onPhotoClick()">
|
||||
<img [src]="'Dress/' + file">
|
||||
</a>
|
||||
</div>
|
||||
|
|
|
@ -19,13 +19,25 @@ interface Commit {
|
|||
})
|
||||
export class PhotosComponent {
|
||||
photos: Commit[];
|
||||
scrollTop: number;
|
||||
|
||||
// I don't know what it used for, but it works fine.
|
||||
ngAfterContentChecked() {
|
||||
let scrollTop = sessionStorage.getItem('scrollTop');
|
||||
document.querySelector('body > app-root > mat-sidenav-container > mat-sidenav-content').scrollTop = Number(scrollTop) || 0
|
||||
}
|
||||
|
||||
constructor() {
|
||||
this.photos = photos.map(this.parseAuthor);
|
||||
this.scrollTop = 0;
|
||||
}
|
||||
|
||||
parseAuthor(commit: Commit) {
|
||||
const [author, username, email] = commit.author.match(/(.+?) <(.+?)>/);
|
||||
return { username, email, ...commit };
|
||||
}
|
||||
onPhotoClick() {
|
||||
this.scrollTop = document.querySelector('body > app-root > mat-sidenav-container > mat-sidenav-content').scrollTop;
|
||||
sessionStorage.setItem('scrollTop', String(this.scrollTop));
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue