web-dev-qa-db-ja.com

角度変換サニタイズがUTF文字で失敗する

Angular 1.3.x、最新バージョンのangular-translate。$sanitizeを使用すると、フィルターまたはサービスを直接使用する場合に問題があるようですが、ディレクティブを使用する場合は機能します。

提案?

次に例を示します。

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>

Jsfiddleの場合: http://jsfiddle.net/gnvpo6aa/

17
fusio

現時点では、2つのオプションがあります。

  1. 戦略sanitizeParametersを使用します。これは、動的パラメーターのみをサニタイズし、実際の変換(テンプレート)はサニタイズしません。変換を制御している場合(動的な値は制御していない場合)、これは機能します。
  2. サニタイズを使用せずにエスケープする戦略escape(またはescapeParameters)を使用します。

免責事項:私は角度変換を共同で維持しています。

編集(2016年12月1日):作成しました すべてのバリアントのこのマトリックスの概要

37
knalli

gitHubの問題 で述べたように

Sceを使用すると問題が解決しました

$translateProvider.useSanitizeValueStrategy("sce");
0
saad