Cannot get ng-click to work in a header widget menu item

Jordan Rose
Tera Expert

I am trying to customize a cloned header menu widget in Service Portal and have links for Approval notifications in the portal banner run an angular function instead of an ng-href link.  For some reason I cannot get any custom ng-click function to work in the header menu item.  See this code for an example.  If I change ng-click="collapse()" to ng-click="customFunc()", the custom function never fires.  Something is overriding the behavior here.  Has anyone out there figured out a way to call a function in angular js scope from a menu item in the the spDropdownTreeTemplate html?

 

 

<a ng-if="mi.type == 'approval'" aria-label="${Open} {{::mi.number}} : {{::mi.short_description}}" aria-describedby="id_{{::mi.unique_number}}"  ng-href="?id=approval&table={{::mi.__table}}&sys_id={{::mi.sys_id}}" ng-click="collapse()" role="menuitem">
  <span ng-if="mi.short_description">{{::mi.short_description | characters:60}}</span>
  <span class="block color-primary text-muted">
    <span class="block" style="float: right" id="id_{{::mi.unique_number}}">
      <sn-time-ago timestamp="::mi.sys_updated_on" />
    </span>
    {{::mi.number}}
  </span>
</a>

 

 
Any help here would be greatly appreciated!  Thanks
1 REPLY 1

Samaksh Wani
Giga Sage
Giga Sage

Hello @Jordan Rose 

 

The reason behind is href is overriding on ng-click, you can use the href or link in the client script as well. Just remove the ng-href from HTML.

 

Plz Mark my Solution as Accept and Give me thumbs up, if you find it helpful.

 

Regards,

Samaksh