How to Initialize Action bar item component

,
1

Hello,

 I am adding an one status in my action bar. I have define my component in module file into the providers using following code

{
  provide: HOOK_ACTION_BAR,
  useValue: [{ template: ActionbarComponents, priority: 10, placement: 'right', Injector: actionbarService, refreshTrigger: true } as ActionBarItem],
  multi: true,
}

Which work for me I can able to show the status on action bar, now the issue I am facing is my action bar component is not initializing if I travel in between pages and because of this I am not able to fetch my Id from route.

Can you please help me to initialize my action bar component on navigation between pages?

2

Please provide your code of the ActionbarComponents so we can support you in properly implementing it.

3

Hello Tristan,

Thanks for the reply

I have added the below code in my ActionbarComponents html file

<c8y-action-bar-item placement="right" class="customitem">
 <div>
     <p>{{AVAILABLE}}</p>
 </div>
</c8y-action-bar-item>

Now when I am going to other group I want to fetch the id and need to show the status. But my component is not getting initialize not even in constructor and ngOninit.

4

The HTML is not that much of interest here. Can you provide the typescript file of the ActionbarComponents?
You probably missed to subscribe on changes of that id and just take the initial value.

The way you’ve added your ActionbarComponents it will also always have this entry in the action bar on every page of your app, is that your intention?

5

Hi Ashwin,

you can subscribe to router events:

constructor(public router: Router) {
    
    this.router.events.subscribe(async (val) => {
        if (val instanceof NavigationEnd) {
            let url: string = val.url;
            // get the device ID from the url and do what you want
         }
    });

Thanks
Bishan

6

Thank you so much Bishan, It did worked for me!

7

This topic was automatically closed 180 days after the last reply. New replies are no longer allowed.