Reputation: 1580
I'm trying to run $sce.trustAsHtml
on a string. It throws Error: $sce:itype
String Value is Required for SCE Trust Call even though I'm using it on a function that returns a string.
Here's a PLUNKER and the snippet causing the error.
/*****
* Should display two images
* *****/
$scope.image = determineNeverSettleImage("engaging,innovative");
$scope.image = $sce.trustAsHtml($scope.image);
/************
* This function should:
* return 3 images if passed "engaging,innovating,partnering",
* return 2 images if passed "engaging,innovating",
* return 1 image if passed "engaging"
**************/
function determineNeverSettleImage(neverSettle) {
if (neverSettle.split(",").length > 1) {
neverSettleArray = neverSettle.split(",");
neverSettleStr = "";
for (i = 0; i < neverSettleArray.length; i++) {
if (neverSettleArray[i] == "engaging") {
neverSettleStr += '<img src="http://lorempixel.com/400/200/" width="56px" height="56px">';
}
if (neverSettleArray[i] == "innovating") {
neverSettleStr += '<img src="http://lorempixel.com/400/200/" width="56px" height="56px">';
}
if (neverSettleArray[i] == "partnering") {
neverSettleStr += '<img src="http://lorempixel.com/400/200/" width="56px" height="56px">';
}
if (neverSettleArray[i] == "synergy") {
neverSettleStr += '<img src="http://lorempixel.com/400/200/" width="56px" height="56px">';
}
}
$scope.test = neverSettleStr;
neverSettleStr = neverSettleStr + '';
return neverSettleStr;
} else {
switch (neverSettle) {
case "engaging":
neverSettle = '<img src="http://lorempixel.com/400/200/" width="56px" height="56px">';
return neverSettle;
case "innovating":
neverSettle = '<img src="http://lorempixel.com/400/200/" width="56px" height="56px">';
return neverSettle;
case "partnering":
neverSettle = '<img src="http://lorempixel.com/400/200/" width="56px" height="56px">';
return neverSettle;
case "synergy":
neverSettle = '<img src="http://lorempixel.com/400/200/" width="56px" height="56px">';
return neverSettle;
}
}
}
Perhaps there is something wrong with my logic? Or am I using $sce.trustAsHtml
incorrectly somehow?
Upvotes: 0
Views: 184
Reputation: 1075
I think you're having an issue because you're assigning $scope.image
a value and then trusting it. Try:
$scope.image = $sce.trustAsHtml(determineNeverSettleImage("engaging,innovative"));
As a side note, if you are wanting to pull in a resource, you should be using trustAsResourceUrl
, which you could then use in an ngRepeat
. Just so you know you have options.
$scope.image = $sce.trustAsResourceUrl();
Upvotes: 1