RC.1 में कुछ शैलियों

Question

शैलियाँ तरह

<div [style.background-image]="\'url(\' + image + \')\'">Background</div> 
<div [style.transform]="rotate(7deg)" 

नहीं जोड़े जाते हैं अब और

Answer 1

अद्यतन (2.0.0 अंतिम)

बाध्यकारी सिंटैक्स का उपयोग नहीं जोड़ा जा सकता

import { Pipe, PipeTransform } from '@angular/core'; 
import { DomSanitizer } from '@angular/platform-browser'; 

@Pipe({name: 'safeHtml'}) 
export class SafeHtml implements PipeTransform { 
    constructor(private sanitizer:DomSanitizer){} 

    transform(html) { 
    return this.sanitizer.bypassSecurityTrustStyle(style); 
    // return this.sanitizer.bypassSecurityTrustHtml(style); 
    // return this.sanitizer.bypassSecurityTrustScript(value); 
    // return this.sanitizer.bypassSecurityTrustUrl(value); 
    // return this.sanitizer.bypassSecurityTrustResourceUrl(value); 
    } 
} 

यह भी देखें https://angular.io/api/platform-browser/DomSanitizer

<div [innerHTML]="someHtml | safeHtml" 

अद्यतन

DomSanitizationService RC.6

मूल

में DomSanitizer को नाम बदलने की इस RC.2 में तय किया जाना चाहिए जा रहा है

भी देखें

---

Angular2 सीएसएस मूल्यों की सफ़ाई और संपत्ति RC.1 में [innerHTML]=... और [src]="..." तरह बाध्यकारी

देखें intruduced भी https://github.com/angular/angular/issues/8491#issuecomment-217467582

मूल्यों के रूप में DomSanitizer.bypassSecurityTrustStyle(...)

का उपयोग करके भरोसा चिह्नित किया जा सकता

import {DomSanitizer} from '@angular/platform-browser'; 
... 
constructor(sanitizer: DomSanitizationService) { 
    this.backgroundImageStyle = sanitizer.bypassSecurityTrustStyle('url(' + this.image + ')'); 
    // for HTML 
    // this.backgroundImageStyle = sanitizer.bypassSecurityTrustHtml(...); 

} 

और अविश्वसनीय सादा स्ट्रिंग के बजाय इस मान को बाध्यकारी।

यह भी

someHtml = `<a href="#" onClick="alert(document.cookie);">click to see the awesome</a>`; 

साथ

@Pipe({name: 'safeStyle'}) 
export class Safe { 
    constructor(private sanitizer:Sanitizer){} 

    transform(style) { 
    return this.sanitizer.bypassSecurityTrustStyle(style); 
    // return this.sanitizer.bypassSecurityTrustHtml(style); 
    // return this.sanitizer.bypassSecurityTrustScript(value); 
    // return this.sanitizer.bypassSecurityTrustUrl(value); 
    // return this.sanitizer.bypassSecurityTrustResourceUrl(value); 
    } 
} 

<div [ngStyle]="someStyle | safeStyle"></div> 

की तरह एक पाइप में लिपटे जा सकती है, अभी भी काम कर रहा है: - [(यह कार्य प्रगति पर)

Plunker example (कोणीय 2.0.0-आरसी -1)

भी देखें Angular 2 Security Tracking Issue

और https://angular.io/docs/ts/latest/api/platform-browser/index/DomSanitizer-class.html

सुझाव के बारे में {{...}}

साफ़ किया सामग्री prop="{{sanitizedContent}}" क्योंकि {{}} stringyfies से पहले ही असाइन किया गया है जो सफ़ाई टूट जाता है मूल्य का उपयोग कर के लिए बाध्य नहीं किया जा सकता।