angular - 如何在Angular中逃避花括号

我的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

最佳答案

视图

<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

关于angular - 如何在Angular中逃避花括号，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/44160046/