On tab click change url with hashtag

  1. MDB Home Page
  2. Support Main Page
  3. MDB Angular
Topic: On tab click change url with hashtag

maticdiba pro asked 6 years ago

Hi,

I am using tabs component on one of my pages. I would like to achieve that by clicking on one of the tabs url would change from something like this: /user/321 to this: /user/321#friendlist

By this I would like to achieve that by following link: /user/321#friendlist, list of friends tab would be selected. Is there a tutorial that would help me achieve that?

Damian Gemza staff answered 6 years ago

Dear @maticdiba 

You have to search the Internet for some tutorials because your question is not directly related to the MDB but to the Angular itself.

Please check this link. Maybe this will answer your question.

Best Regards,

Damian

maticdiba pro answered 6 years ago

Thank you for your answer. I tried this approach, but when I try to use the parameter and programatically set active tab with:

this.staticTabs.setActiveTab(selectedTab > 0 ? selectedTab : 0);
I get error that staticTabs is undefined. I call this command in ngOnInit. I declare staticTabs like this:
@ViewChild('staticTabs') staticTabs: TabsetComponent;
SelectedTab variable is retrieved from router.queryParams and holds a valid number (tested).
 
If I try to set it with button command it works. I'm not sure where the problem is. 

Arkadiusz Idzikowski staff commented 6 years ago

You need to call this method in ngAfterViewInit hook.

maticdiba pro commented 6 years ago

That worked. I was sure that I used it in ngInit before. Thank you for your help.

 
Write
Create snippet
Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Status

Answered

Specification of the issue
  • User: Pro
  • Premium support: No
  • Technology: MDB Angular
  • MDB Version: 7.0.0
  • Device: computer
  • Browser: chrome
  • OS: windows
  • Provided sample code: No
  • Provided link: No
Tags
tabs hashtag
Related topics
1
Table Pagination with Tabs
1
Selecting tabs programmatically
1
Improve Tabs component with horizontal scrolling, paging or with a dropdown
0
Problem with tabs and pills - CSS failing
0
Tab navigation with buttons
About author
maticdiba
Pro User
45Support score
3Questions 3Answers
0Snippets likes 0Snippets