Angular2表示IE

Question

在Angular2部件我有以下空：

<div ng-if="heading" [innerHTML]="heading"></div>

鉻& Safari瀏覽器很好地工作 - 但IE是表示在DIV null。我不知道爲什麼...標題是undefined，仔細檢查！

Answer 1

正確的語法在Angular2應該是

<div *ngIf="heading" [innerHTML]="heading"></div> 

Answer 2

它是*ngIf

<div *ngIf="heading" [innerHTML]="heading"></div> 

Answer 3

Angular2 NgIf語法：

<div *ngIf="condition">...</div> 
<div template="ngIf condition">...</div> 
<template [ngIf]="condition"><div>...</div></template> 

實施例：

<div *ngIf="errorCount > 0" class="error"> 
    <!-- Error message displayed when the errorCount property in the current context is greater than 0. --> 
    {{errorCount}} errors detected 
</div> 

Answer 4

對於那些誰不喜歡，你必須做ngIf每當innerHTML的可能是不確定的事實，這裏的跨您的應用程序解決了一個解決方案：

constructor(sanitize: DomSanitizer) { 
    // override the sanitize method so that it returns an empty string instead of null so that IE doesn't show "null" in the DOM 
    sanitize.sanitize = function(context: SecurityContext, value: SafeValue | string | null) { 
     return (sanitize as any).__proto__.sanitize.call((sanitize as any), context, value) || ''; 
    }; 
} 

我把這個在app 。模塊構造函數。

你可能會問，「爲什麼這樣一個hacky的方法？」這很大程度上是因爲DomSanitizer是一個充當類的接口。真正的衛生處理髮生在未公開暴露的DomSanitizerImpl類中。