2017-08-25 55 views
2

實際情況很簡單:我想爲我的庫那是因爲我想要的代碼示例演示與粘貼部位有一起提供的文檔。如何告訴Angular不要編譯模板的某些部分?

所以我的問題是:如何使一個部分編譯且可執行的,但另一個 - 只是一個文本(帶雙大括號!)。

例如:

<angular-switchery [(ngModel)]="swticherModel"></angular-switchery> 
Switcher: {{swticherModel? 'ON' : 'OFF'}} 
+0

https://stackoverflow.com/questions/42516548/how-to-escape-the-curly-braces-in-an-angular-template – yurzui

回答

1

在這裏看到:http://www.syntaxsuccess.com/viewarticle/ignoring-angular-2.0-bindings

可以使用ngOnBindable指令,或DomSanitizer顯示前消毒的文本。

<div ngNonBindable>{{10 * 10}}</div> 

對於大教堂消毒劑,導入服務

import { DomSanitizer } from '@angular/platform-browser' 

注入它在構造函數中

constructor(private sanitizer: DomSanitizer) { 

那麼無論你需要注入文本,使用bypassSecurityTrustHTML方法。

this.sanitizer.bypassSecurityTrustHTML(your string here) 

很多人把消毒液進入管道,因此在輕鬆的模板,能自動消毒字符串,但我不知道是否會爲您的使用情況下工作。

1

據我所知,你有兩個選擇:

•您想要顯示的代碼只是簡單的部分:你也許能夠「逃離」你的雙在括號中加雙引號括起來。如果它不工作,你仍然可以存儲字符串內您的代碼示例•您希望提供更多的後續片斷,你會用{{myPieceOfCodeToShow}}

顯示:清潔解決方案,我所知道的是存儲在外部文本文件,並把這些片段將它們加載爲大字符串。

相關問題