Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

angular-translate sanitisation fails with UTF characters

On Angular 1.3.x with latest version of angular-translate. Using $sanitize it seems there are problems when using filter or service directly, but it works when using the directive.

Suggestions?

Here is an example:

var myApp = angular.module('myApp', [ 'pascalprecht.translate', 'ngSanitize' ]);

myApp.config(function($translateProvider) {
    $translateProvider.useSanitizeValueStrategy("sanitize");
    $translateProvider.preferredLanguage('en');
    $translateProvider.translations('en', {
        UTF: 'öéü',
    });
});

myApp.controller("myCtrl", function($scope, $translate) {
    $translate("UTF").then(function(trans) {
        $scope.UTFCTRL = trans;
    });
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.16/angular-sanitize.min.js"></script>
<script src="http://rawgit.com/PascalPrecht/bower-angular-translate/master/angular-translate.min.js"></script>

<div ng-app="myApp" ng-controller="myCtrl">
    <div>
        Wrong: <h1>{{ 'UTF' | translate }}</h1>
    </div>
    
    <div>
        Ok: <h1 translate="UTF"></h1>
    </div>
    
    <div>
        Wrong: <h1>{{ UTFCTRL }}</h1>
    </div>
</div>

On jsfiddle: http://jsfiddle.net/gnvpo6aa/

like image 964
fusio Avatar asked Jun 23 '15 12:06

fusio


1 Answers

At the moment, you have two options:

  1. Use the strategy sanitizeParameters which will only sanitize the dynamic parameters, but not the actual translation (template). If you have the translation under control (but not the dynamic values), this will work.
  2. Use the strategy escape (or escapeParameters) which does not use sanitization but escaping.

Disclaimer: I'm co-maintaining angular-translate.

Edit (12.01.2016): I'd created this matrix overview of all variants.

like image 85
knalli Avatar answered Nov 11 '22 03:11

knalli