2017-09-09 4 views
3

Ich mag einen HTML-Code in meinem HTML-Code dynamisch platzieren, so schreibe ich den folgenden Code:
Inneres HTML von ng-container, Angular 4?

<ng-container [innerHTML]="buttonIcon"></ng-container> 

Angular sagt innerHTML ist nicht gültig Attribut für ng-container
Ich will nicht dritten HTML verwenden Tag wie folgt:

<div [innerHTML]="buttonIcon"></div> 

Also, wie kann ich HTML-Codes ohne irgendeine Tag innere HTML-Bindung einfügen?

+0

Was ist mit ' Randy

+1

Ich habe es getestet, es wirft den gleichen Fehler –

+2

hat keinen visuellen Effekt und akzeptiert innerHTML – Vega

Antwort

3

ng-container nicht in HTML gerendert bekommt, es ist eine bloße structural directive.

Das Eckige ist eine Gruppierung Element, das nicht mit Arten oder Layout nicht stört, weil Angular nicht im DOM nicht setzen.

So gibt es kein Element, in das HTML eingefügt werden kann. Sie müssen mit einem Sub-Div arbeiten. Wenn Sie Ihrer Meinung nach kein Sub-Div benötigen, können Sie höchstwahrscheinlich auch ng-container durch div selbst ersetzen und den Container überhaupt nicht verwenden.

+1

Ich sehe nicht, wie dies die Frage beantwortet, da Sie vorschlagen, hinzuzufügen s sub-div ... –

+0

@eugen_sunic ja und ich habe auch erklärt warum. 'ng-container' kann * nicht * eine innereHTML attr haben, da sie nicht Teil des DOM ist. Sie müssen stattdessen ein anderes Element verwenden, z. B. div. – Blauhirn

+1

Ja, aber dann haben Sie ein extra div oder irgendein anderes HTML-Element, das Zugriff auf das InnerHTML-Attribut hat, das Ihren HTML-Code umgibt/umgibt, den Sie nicht wollen ... –

2

können Sie ngTemplate verwenden:

<ng-template #buttonIcon> 
    <div> Your html</div> 
</ng-template> 
<ng-container 
    *ngTemplateOutlet="buttonIcon"> 
</ng-container> 
+0

Sie sind immer noch div ... –