2017-01-18 6 views
1

Я пытаюсь применить санированный атрибут src к iframe, прямо он отлично работает, но при размещении всего в директиве атрибута он отказывается играть в мяч. Вот код директивы, и сообщение об ошибке, которое появляетсяAngular2: создание iframe src safe с помощью директивы

import { OnInit, Directive, ElementRef, Input, Renderer } from '@angular/core'; 
import { DomSanitizer, SafeResourceUrl} from '@angular/platform-browser'; 


@Directive({ 
    selector: '[resume]' 
}) 
export class ResumeDirective implements OnInit { 

    @Input('resume') inputLink: string; 

    constructor(private _sanitizer: DomSanitizer, private el: ElementRef, private render: Renderer) { 

    } 

    ngOnInit(): void { 
     let _url: string = this.inputLink + '#zoom=100'; 

     let resumeUrl: SafeResourceUrl = this._sanitizer.bypassSecurityTrustResourceUrl(_url); 

     // this.el.nativeElement.src = resumeUrl.toString(); // same result 
     this.render.setElementProperty(this.el.nativeElement, 'src', _url); 
     // using 'srcdoc' or setElementAttribute brings same results 
    } 
} 

Я получаю сообщение об ошибке: SafeValue must use [property]=binding: /theurl/x.pdf#zoom=100 (see http://g.co/ng/security#xss)

ответ

2

Вы можете попробовать @HostBinding() - не уверен, если это будет работать, хотя

@Directive({ 
    selector: '[resume]' 
}) 
export class ResumeDirective implements OnInit { 

    @Input('resume') inputLink: string; 

    constructor(private _sanitizer: DomSanitizer, private el: ElementRef, private render: Renderer) { 

    } 

    @HostBinding('src') 
    resumeUrl:any; 

    ngOnInit(): void { 
     let _url: string = this.inputLink + '#zoom=100'; 

     this.resumeUrl = this._sanitizer.bypassSecurityTrustResourceUrl(_url); 
    } 
} 

this.render.setElementProperty Безразлично» не заботясь о дезинфицированных значениях, он просто обращается к DOM API и передает санированное значение как есть.

+3

yup, быстрее ответ Я когда-либо получал, что на самом деле работал :) спасибо – Ayyash