How To Add Angular Provider Dependency To A Custom Service Portal Header Widget

sufihaikal
Tera Contributor

Hi Community,

I am hoping someone can help me with an issue I have been struggling with regarding Angular Providers and customize header widgets in Service Portal.



Background

I created a custom header widget and add function pop up modal for high-traffic mode/Surge mode from default Employee Center Header. The goal was to add custom modifications while keeping the core functionality intact, including the Surge Event Modal popup (cdSurgeEventModal).

 

The issue
The modal popup works perfectly in the OOTB Employee Center Header. Initially content for both headers are the same, but gradually i change the customize header exact same as OOTB Employee Center Header because the pop up modal does NOT appear in my custom header widget. But even after changes the pop up modal still wasn't appear.
Even though:

Both headers share the same HTML template
Both headers share the same Server Script
Both headers share the same Client Controller

The Cause of Issue
At first i thought it is because the data from retrieving the company event from cache doesn't return data because in HTML body template do use ng-if. But i realize it wasn't because of that , it is because of the customize header do not have dependency of the widget angular providers cdSurgeEventModal that is used for the pop modal.

Things I have already tried
I have watched some video/read article on how can i add widget angular dependency for widget that i created. Most of it just says that i need to go to Service Portal > Widget . Select the customize widget. Scroll down to related list and there is a tab angular provider,  add cdSurgeEventModal into the tab. So here what i have try,

Adding Angular Provider via related list
(tab does not exist for header widgets)

Checking Angular ng-templates tab
(empty for both OOTB and custom header)


The main issue that i face right now is there is no tab angular providers for header widget but for other widget there is a tab for angular providers.
Here is example from my screenshot :

Customize Header : 

sufihaikal_0-1782350834470.png


Other Widget(Actions Widget) : 

sufihaikal_1-1782350875729.png

 


My question is what is right way for me to add dependency of cdSurgeEventModal or any other Widget Angular Providers into a customize widget in my case it is a header.
I am sorry if the question is too fundamental, and i really appreciate your help.

0 REPLIES 0