我试图找出如何消除此警告
WARNING: Binding style attributes may introduce cross-site scripting vulnerabilities; please ensure that values being bound are properly escaped. For more information, including how to disable this warning, see http://emberjs.com/deprecations/v1.x/#toc_binding-style-attributes.
控制器:
percentComplete: function() {
var percent = this.get('numProcessed') / this.get('numToDo') * 100;
return percent.toString().htmlSafe();
}.property('numProcessed', 'numToDo')
模板:
<div style="width:{{percentComplete}}"></div>
版本:
Ember : 1.13.7
Ember Data : 1.13.8
jQuery : 1.11.3
其他尝试过的解决方案......
我也尝试按照http://emberjs.com/deprecations/v1.x/#toc_binding-style-attributes的步骤操作,但是他们并没有详细说明escapeCSS()
,Ember.Handlebars.SafeString
似乎也不是他们的榜样。
在相关的说明中,我可以看到这种情况经常被使用,所以我首先尝试使用模板创建一个帮助器,但没有成功:
<div style="width:{{safe-css percentComplete}}"></div>
助手尝试:
return Ember.String.htmlSafe(params[0]);
return Ember.Handlebars.SafeString(params[0]);
var safeInput = Ember.Handlebars.Utils.escapeExpression(params[0]);
return new Ember.String.htmlSafe(safeInput);
我在这里缺少什么?
答案 0 :(得分:2)
您无法在模板中连接样式:
<div style="width: {{percentComplete}}"></div>
而是将整个样式属性包装在htmlSafe
<!-- Template -->
<div style={{percentCompleteCss}}></div>
// Controller
percentCompleteCss: function() {
var num = this.get('numProcessed') / this.get('numToDo') * 100;
return ('width: ' + num.toString() + '%').htmlSafe();
}.property('numProcessed', 'numToDo'),