Wie wiederhole ich ein Stück HTML mehrere Male ohne ngFor und ohne eine andere @Component

7

Das Problem ist einfach, ich möchte ein Stück HTML mehrmals in meiner Vorlage wiederholen.

Aber ich möchte, dass es an verschiedenen Stellen auf meiner Seite wiederholt wird, das bedeutet, dass ein ngFor nicht die Lösung ist, da die Stücke direkt nacheinander wiederholt werden würden.

Eine 'funktionierende Lösung' würde sein, eine bestimmte @ Komponente für mein wiederholtes HTML zu definieren und so etwas zu tun: <p>Whatever html</p><my-repeated-html></my-repeated-html><h4>Whatever</h4><my-repeated-html></my-repeated-html>

Aber ich finde es übertrieben, eine dedizierte Komponente zu erstellen, um so etwas zu tun, es hat keine funktionale Bedeutung und wird nur von der HTML-Struktur benötigt, die ich einrichten möchte.

Gibt es wirklich nichts in ng2 template engine, um es zu ermöglichen, ein "inneres Template" zu definieren und es dort zu verwenden, wo ich es in der aktuellen Vorlage brauche?

Wenn die Antwort nein lautet, würde ich den HTML-Code wahrscheinlich eher duplizieren, selbst wenn das irgendwie nervt.

    
ATX 07.06.2016, 10:18
quelle

2 Antworten

20

Angular 5 aktualisieren

ngOutletContext wurde in ngTemplateOutletContext

umbenannt

Siehe auch Ссылка

Original

Das kürzlich hinzugefügte ngTemplateOutlet könnte das sein, was Sie möchten

%Vor%

Es kann derzeit wie

verwendet werden %Vor%

Eine Vorlage kann auch an eine untergeordnete Komponente übergeben werden, um dort gerendert zu werden

%Vor%

wird wie

verwendet %Vor%

Plunker-Beispiel

Ein weiteres Plunker-Beispiel Das verwendet als

übergebene Daten %Vor%

Auf diese Weise kann ngOutletContext in der Vorlage wie

verwendet werden %Vor%

wobei image eine Eigenschaft von templateData

ist

Wenn $implicit verwendet wird

%Vor%

Das ngOutletContext kann in der Vorlage wie

verwendet werden %Vor%     
Günter Zöchbauer 07.06.2016, 10:33
quelle
2
%Vor%

und in der rx-Komponente:

%Vor%

achten Sie auf:

[ngOutletContext]="{$implicit: item}"

sowie

<template #customTemplate let-item>

    
born2net 15.02.2017 16:56
quelle

Tags und Links