2017-05-24 102 views
2

我有这个在我的HTML:如何逃避花括号中的角

<iframe src="https://kart.1881.no/?direction={59.83006424|6.25588723|START}{{{latitude}}|{{longitude}}|M%C3%85L}"></iframe> 

通知 {{{latitude}} - 在这里,我想逃离第一{

我试图把\{,但它无法正常工作以及。

的错误是Missing expected : at the end of the expression

+0

的可能的复制[如何在Angular2中为模板的一部分禁用模板绑定?](https://stackoverflow.com/questions/368 21734 /如何禁用模板绑定在模板中的部分角度) – JayChase

+0

不要使用AngularJS标签的问题关于Angular 2请 – Mistalis

回答

1

视图

<iframe [src]="'https://kart.1881.no/?direction={59.83006424|6.25588723|START}{' + latitude + '|' + longitude + '|M%C3%85L}' | safe"></iframe> 

而下水管应该帮助你

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

@Pipe({ name: 'safe' }) 
export class SafePipe implements PipeTransform { 
    constructor(private sanitizer: DomSanitizer) {} 
    transform(url) { 
     return this.sanitizer.bypassSecurityTrustResourceUrl(url); 
    } 
} 

您可以覆盖插值像

template: ` 
    <iframe src="https://kart.1881.no/?direction={59.83006424|6.25588723|START}{[[latitude]]|[[longitude]]|M%C3%85L}"></iframe> 
    `, 
interpolation: ['[[', ']]'] 

但无论如何你必须消毒url将财产(不插值)只工作结合

Plunker Example

1

您可以用%7B尝试{%7D}。这些只是URI编码的形式,Angular不应该试图解析。

+0

不起作用错误:不安全的值用于资源URL上下文中(请参阅http://g.co/ng/security#xss) –

0

使用+运算符来连接所需的SRC

src="...{' + {{latitude}}+ '}...'"

+0

您必须将'src'更改为'[src]'才能这样做 – trichetriche

+0

不使用'[]' – AngJobs

+0

派对正确。但它会给出与\t 相同的错误不起作用错误:资源URL上下文中使用的不安全值 –