Topic: ImageModalComponent breaking browser history
Hello,
I am having a problem with ImageModalComponent
The expected behavior would be when i open a view that contains ImageModalComponent and click the browser back button, that it navigates me to the previous page.
*Actual behavior*The actual behavior is that when i click browers back on a view that contains ImageModalComponent it navigates me 2,3 or sometimes even more times back.
*Resources (screenshots, code snippets etc.)*I have identified the code in the ImageModalComponent that could provoke such behavior:
ImageModalComponent.prototype.ngAfterViewInit = /**
* @return {?}
*/
function () {
var _this = this;
// fix(lightbox): resolve problem with not closing lightbox when using back button (both browser and native device)
// There were a problem, that with opened lightbox, if user have pressed the back button
// (both physical device button and browser button)
// the lightbox weren't closed, but the whole application was closed (because of changing the URL).
if (typeof history.pushState === 'function') {
history.pushState('newstate', '', null);
window.onpopstate = (/**
* @return {?}
*/
function () {
if (_this.opened) {
_this.closeGallery();
}
else {
history.go(-2);
}
});
}
};
Also, I ve read that the accepted solution is to upgrade to the newer version. Since we arent able to upgrade it, i need to ask if there is a workaround or solution for this problem? In addtion we are using angular version 8.2.3.
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Resolved
- User: Pro
- Premium support: Yes
- Technology: MDB Angular
- MDB Version: 8.4.0
- Device: Desktop
- Browser: All
- OS: Windows 10
- Provided sample code: No
- Provided link: No
Arkadiusz Idzikowski staff commented 4 years ago
I'm afraid there is no easy workaround for this problem. We needed to change how certain things work in the internal code of the component.
dmeic pro premium priority commented 4 years ago
Is it possible to get the earliest version where its fixed? If i want to upgrade to the latest version do i need to upgrade angular to 9+?
Arkadiusz Idzikowski staff commented 4 years ago
This problem should not occur anymore in v8.7.0. You can find more information in our changelog: https://mdbootstrap.com/docs/angular/changelog/#870
The latest version (9.3.1) is not compatible with Angular 8 and you would need to upgrade your Angular version.
dmeic pro premium priority commented 4 years ago
Is it possible to get the 8.7.0 version? Due to our dependencies we arent able to upgrade to angular 9
Arkadiusz Idzikowski staff commented 4 years ago
You should be able to download it in your MDB profile and then upgrade the version in your project like we explained in the update guide: https://mdbootstrap.com/docs/angular/getting-started/update/#pro (switch to 'zip' tab).
If you use installation from our GitLab server, just use this command and add your private token:
npm install git+https://oauth2:<your-auth-token>@git.mdbootstrap.com/mdb/angular/ng-uikit-pro-standard.git#8.7.0 --savedmeic pro premium priority commented 4 years ago
Great! is it possible to get the version of mdb-file-upload aswell via npm Ive tried running the command
npm install git+https://oauth2:@git.mdbootstrap.com/mdb/angular/mdb-file-upload.git#8.7.0 --save
but i get an error that the remote project couldnt be found.
Arkadiusz Idzikowski staff commented 4 years ago
Unfortunately, it's not possible. You would need to download the .tgz archive file of the plugin.
https://mdbootstrap.com/plugins/angular/file-upload/#installation
dmeic pro premium priority commented 4 years ago
Fortunately its working as expected now. Thank you for your support.