大佬教程收集整理的这篇文章主要介绍了typescript – Angular2 – 警告:消除不安全的风格值url(SafeValue必须使用[property] = binding:,大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
这是我在控制台中看到的警告(我已将我的img url更改为/img/path/is/correct.png:
WARNING: sanitizing unsafe style value url(SafeValue must use [property]=binding: /img/path/is/correct.png (see http://g.co/ng/security#xss)) (see http://g.co/ng/security#xss).
事情是我使用Angular2中的DomSanitizationservice来清理注入到我的模板中的内容.这是我在我的模板中的HTML:
<div> <div> <div class="header" *ngIf="image" [style.BACkground-image]="'url(' + image + ')'"> </div> <div class="zone"> <div> <div> <h1 [innerHTML]="header"></h1> </div> <div class="zone__content"> <p *ngFor="let contentSegment of content" [innerHTML]="contentSegment"></p> </div> </div> </div> </div> </div>
这是组件…
Import { DomSanitizationservice,SafeHtml,SafeUrl,SafeStyle } from '@angular/platform-browser'; @Component({ SELEctor: 'example',templateUrl: 'src/content/example.component.html' }) export class CardComponent implements OnChanges { public header:SafeHtml; public content:SafeHtml[]; public image:SafeStyle; public isActive:Boolean; public isExtended:Boolean; constructor(private sanitization:DomSanitizationservicE) { } ngOnChanges():void { map(this.element,this); function map(element:Card,instance:CardComponent):void { if (element) { instance.header = instance.sanitization.bypassSecurityTrustHtml(element.header); instance.content = _.map(instance.element.content,(input:string):SafeHtml => { return instance.sanitization.bypassSecurityTrustHtml(input); }); if (element.imagE) { /* Here is the problem... I have also used bypassSecurityTrusturl */ instance.image = instance.sanitization.bypassSecurityTrustStyle(element.imagE); } else { instance.image = null; } } } } }
请注意,当我刚刚使用[src] =“image”绑定到模板时,例如:
<div *ngIf="image"> <img [src]="image"> </div>
<div class="header" *ngIf="image" [style.BACkground-image]="image"> </div>
还有
if (element.imagE) { instance.image = instance.sanitization.bypassSecurityTrustStyle('url(' + element.image + ')'); } else { instance.image = null; }
否则不会被视为有效的样式属性
以上是大佬教程为你收集整理的typescript – Angular2 – 警告:消除不安全的风格值url(SafeValue必须使用[property] = binding:全部内容,希望文章能够帮你解决typescript – Angular2 – 警告:消除不安全的风格值url(SafeValue必须使用[property] = binding:所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。