Access to ngSanitize in child components - angularjs

Question

I am trying to use ng-bind-html in a child component and it is not working. From what I read, You need to include ngSanitize. Which I have on am parent component and works fine there but can't get it to work on the child. Any ideas? Please let me know if you need more information. Thanks in advance!
var myApp = angular.module('subPackages', ['ngMaterial', 'ngMessages','ngSanitize']).config(function($sceDelegateProvider) {
$sceDelegateProvider.resourceUrlWhitelist([
// Allow same origin resource loads.
'self',
// Allow loading from our assets domain. Notice the difference between * and **.
'<<Protected Content>>**'
]);
});
(function (app) {
'use strict';
app.component('appComponent', {
templateUrl: '../subpackages/templates/app-template.html',
controller: subAppController
});
app.component('cartSummary', {
templateUrl: '../subpackages/templates/cart-summary.template.html',
controller: cartSummaryController,
bindings: {
contentJson: '<',
cartPerfs: '<',
getGlobalContent: '&',
myNewHtml: '&',
callExecLocalProd: '&'
},
});
})(myApp);
Parent
function subAppController($sce, $compile) {
...
}
Child
function cartSummaryController($sce, $compile) {
this.$onInit = function () {
//Get content from Parent
this.globalContent = this.getGlobalContent;
this.cartSummary = this.cartPerfs;
this.myHtml = this.myNewHtml;
this.localProd = this.callExecLocalProd;
this.removePerf = function (obj) {
console.log("removing performance");
var liseqno = $("#mBtnRemove").data("liseqno");
var perfno = $("#mBtnRemove").data("perfno");
//Close modal
$('#myModal').modal('toggle');
var rpParam = [
{ elp_remove_li_seq_no: liseqno, elp_remove_perf_no: perfno }
]
this.localProd({ item: rpParam });
}
}; //End $onInit
this.confirmDelete = function (perf) {
console.log("Confirm Delete");
console.log(perf);
//Replace the perf_desc token with perf description
var msg = this.globalContent({ module: "subpackage", item: "modalMessage" });
var finalDesc = msg.replace(/{perf_desc}/g, perf.perf_desc);
//Set the body of the modal with our message
//$('.modal-body ').text($sce.trustAsHtml(finalDesc));
//$('.cs-modal-body').attr("ng-bind-html", $sce.trustAsHtml(finalDesc));
$('.cs-modal-body').attr("ng-bind-html", finalDesc);
//populate our data attributes that we will need later
$('#mBtnRemove').data("liseqno", perf.li_seq_no)
$('#mBtnRemove').data("perfno", perf.perf_no)
$('#myModal').modal();
}
}
In my html I am using
<p class="cs-modal-body" ng-bind-html="Here"></p>

Answer 1

if you use ng-bind-html="Here", then "Here" should be defined somewhere in your scope/context - it should be a string, which angular will try to parse as html
Define it in the controller.