【问题标题】:angular-translate sanitisation fails with UTF charactersUTF 字符导致角度翻译清理失败
【发布时间】:2015-09-09 05:39:13
【问题描述】:

在 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/

【问题讨论】:

标签: javascript angularjs sanitization angular-translate


【解决方案1】:

目前,您有两种选择:

  1. 使用策略sanitizeParameters,它只会清理动态参数,而不是实际的翻译(模板)。如果您控制了翻译(但不是动态值),这将起作用。
  2. 使用策略escape(或escapeParameters),不使用消毒而是转义。

免责声明:我正在共同维护 angular-translate。

编辑 (12.01.2016):我创建了 this matrix overview of all variants

【讨论】:

  • 通过问题 1011 找到了这个,感谢您的工作和插件!
  • sanitize 为策略,UTF-8 字符在与translate="KEY" 属性一起使用时似乎有效。
  • 这是因为当使用 translate 指令时,sanitize 不起作用......甚至 html 标签也照常运行
  • @knalli :不错的矩阵,但似乎null 策略与“sce”策略具有相同的效果
  • @knalli @LucasCimon 关于 Lucas 关于策略 nullsce 在矩阵中表现相同的评论。我看到从 1.2 版开始,AngularJS 默认启用 SCE。 docs.angularjs.org/api/ng/service/$sce 因此,这很可能是 nullsce 工作相同的原因。是吗?
【解决方案2】:

gitHub issue中所说

使用 sce 解决了问题

$translateProvider.useSanitizeValueStrategy("sce");

【讨论】:

    猜你喜欢
    • 2016-05-07
    • 1970-01-01
    • 1970-01-01
    • 2018-10-02
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多