Dynamically change image on HTML widget

[Christine24]

I'm using the HTML widget as a way to display different logos depending on which company is signed into our portal. The issue I'm trying to resolve is how to actually make this dynamic so that we can use one portal and display the appropriate logo.

Right now the HTML widget will only display my one logo and I have to change the code to display the other logo. I decided to clone the HTML widget and wanted to make an if statement. This is what I have so far but I don't know how to code in HTML and it's not working.

<div>
  <div ng-if="!c.options.html" class="panel panel-default">
    <div class="panel-body">
    <a class="navbar-brand navbar-brand-logo" ng-if=user.company == '084cc9e64f4f7700eb11eddf0210c795' "
<p style="text-align: center; margin-top: 50px; margin-bottom: -50px;"><img src="cfn.svg" /></p>
<a class="navbar-brand navbar-brand-logo" ng-if=user.company == 'bd2eb1851bd73700762f8596dc4bcbc7' "
<p style="text-align: center; margin-top: 50px; margin-bottom: -50px;"><img src="mml.svg" /></p>
    </div>
  </div>
  <div ng-if="c.options.html" ng-bind-html="c.html"></div>
</div>

[Pranav Bhagat]

Can you share the client script and full markup of HTML

[Christine24]

HTML Template

<div>
  <div ng-if="!c.options.html" class="panel panel-default">
    <div class="panel-body">
    <a class="navbar-brand navbar-brand-logo" ng-if="data.companylogovalue == '084cc9e64f4f7700eb11eddf0210c795'"></a>
<p style="text-align:center; margin-top:50px; margin-bottom:-50px;"><img src="cfn.svg" /></p>
<a class="navbar-brand navbar-brand-logo" ng-if="data.companylogovalue == 'bd2eb1851bd73700762f8596dc4bcbc7'"></a>
<p style="text-align: center; margin-top: 50px; margin-bottom: -50px;"><img src="mml.svg" /></p>
    </div>
  </div>
  <div ng-if="c.options.html" ng-bind-html="c.html"></div>
</div>

Client Script

function ($scope, $sce) {
	var c = this;
	c.html = $sce.trustAsHtml(c.options.html);
	$scope.$watch('c.options.html',function(){
		c.html = $sce.trustAsHtml(c.options.html);
	})
}

Server Script

var company_id;
var user_id = gs.getUserID();
var gr = new GlideRecord('sys_user');
gr.addQuery('sys_id',user_id);
gr.query();
if(gr.next()){
	company_id = gr.company; 
}

data.companylogovalue=company_id; //gives you sys_id of company which we use in HTML

[Pranav Bhagat]

Try removing this on Line 2

ng-if="!c.options.html"

[Christine24]

It's closer with removing that!

Now it's showing both logos and the hi

[Pranav Bhagat]

That means your server script is not working.

To remove hi,remove this

<div ng-if="c.options.html" ng-bind-html="c.html"></div>