I need to sanitize special characters in options, but it doesn't work correctly. Maybe anybody can tell me how i should do it correctly?

For example:

HTML:

<div ng-controller="Ctrl">
    <select id="limitType" name="limit" ng-model="selectedLimit" ng-options="limit.text for limit in limits" ng-init="selectedLimit='5'" ng-bind-html="limit.text"></select>
<div>

JS:

var app = angular.module('app', ['ngSanitize']);

function Ctrl($scope) {
  $scope.limits = [{
    text: 'Afficher ™ par page'
  }, {
    text: 'Afficher 10 par page'
  }, {
    text: 'Afficher 15 par page'
  }, {
    text: 'Afficher 20 par page'
  }];   
}

Here is link on fiddle: /

I need to sanitize special characters in options, but it doesn't work correctly. Maybe anybody can tell me how i should do it correctly?

For example:

HTML:

<div ng-controller="Ctrl">
    <select id="limitType" name="limit" ng-model="selectedLimit" ng-options="limit.text for limit in limits" ng-init="selectedLimit='5'" ng-bind-html="limit.text"></select>
<div>

JS:

var app = angular.module('app', ['ngSanitize']);

function Ctrl($scope) {
  $scope.limits = [{
    text: 'Afficher ™ par page'
  }, {
    text: 'Afficher 10 par page'
  }, {
    text: 'Afficher 15 par page'
  }, {
    text: 'Afficher 20 par page'
  }];   
}

Here is link on fiddle: http://jsfiddle/rfTV2/3/

• javascript
• angularjs
• ng-options
• ng-bind-html

Share Improve this question Follow asked Jan 17, 2014 at 13:34 MalMal 6311 silver badge55 bronze badges 2

• you need to add angular-sanitise.js to "External resources". Look here – BuDen Commented Jan 17, 2014 at 13:43
• If you open attached link then you can see, that i added sanitise via option for angularjs-1.0.3. BTW, when i include include angularjs-1.2 and add angular-sanitise.js in "External resources" it still will not work. – Mal Commented Jan 17, 2014 at 14:29

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 6

You have three options.

1. You can include unicode characters in your source directly
2. You can convert the html entities to unicode in the browser using JavaScript
3. Or you can fall-back to ng-repeat and use ng-bind-html on your option tag.

I think CAT already provided answer. I am just providing readigs for how to use ng-bind-html

1. ng-bind-html directive
2. ng-sanitize module
3. $sce service

Have you tried ?

$sce.trustAsHtml()

In your example it would be something like this (not tested)

function Ctrl($scope, $sce) {
  $scope.limits = [{
    text: $sce.trustAsHtml('Afficher ™ par page')
  }, {
    text: 'Afficher 10 par page'
  }, {
    text: 'Afficher 15 par page'
  }, {
    text: 'Afficher 20 par page'
  }];   
}