hinzufügen Element mit Router dynamisch

Wenn ich in someweher in einem Winkel 2-Komponenten wie dies ein Ankerelement setzen,hinzufügen Element mit Router dynamisch

<a [routerLink]="['/LoggedIn/Profile']">Static Link</a>

alles funktioniert gut. Wenn Sie auf den Link klicken, leitet der eckige Router mich zur Zielkomponente.

Jetzt möchte ich den gleichen Link dynamisch hinzufügen. Irgendwo in meiner App habe ich eine "Benachrichtigungskomponente", deren einzige Verantwortung darin besteht, Benachrichtigungen anzuzeigen.

Die Benachrichtigungen Komponente macht etwas wie folgt aus:

<div [innerHTML]="notification.content"></div>

wo notification.content die String-Variable in der NotificationComponent Klasse ist, und enthält die HTML angezeigt werden soll.

Das notification.content Variable kann so etwas wie

enthält

<div>Click on this <a [routerLink]="['/LoggedIn/Profile']">Dynamic Link</a> please</div>

Alles funktioniert gut und zeigt auf meinem Bildschirm, aber es passiert nichts, wenn ich den dynamischen Link klicken ?!

Gibt es eine Möglichkeit, den eckigen Router mit dieser dynamisch hinzugefügten Verbindung arbeiten zu lassen ???

ps. Ich weiß über DynamicComponentLoader, aber ich brauche wirklich eine uneingeschränkte Lösung, wo ich alle Arten von HTML an meine Benachrichtigungskomponente senden kann, mit allen Arten von verschiedenen Links ....

Quelle

2016-03-30 Jeroen1984

Hey, haben Sie die Lösung durch Zufall gefunden? – ValeriiVasin

ist eine Direktive. Richtlinien und Komponenten werden nicht für HTML erstellt, das mit [innerHTML] hinzugefügt wird. Dieser HTML-Code wird von Angular in keiner Weise verarbeitet.

Der empfohlene Weg ist nicht [innerHTML] aber ~~DynamicComponentLoader~~ ViewContainerRef.createComponent, wo Sie den HTML-Code in einer Komponente wickeln zu verwenden und dynamisch hinzuzufügen.

Für ein Beispiel siehe Angular 2 dynamic tabs with user-click chosen components

Quelle

2016-03-30 13:30:34

Hmm das war nicht die Antwort die ich mir erhofft hatte. Ich möchte wirklich keine Komponente für jede andere Benachrichtigung erstellen. Ich hatte gehofft, es gäbe eine Möglichkeit, das dom für alle neu hinzugefügten Direktiven oder so etwas zu scannen ... – Jeroen1984

Sie können Daten an die Komponente übergeben und in der Komponentenvorlage an sie binden, um sie für ähnliche Szenarien wiederverwendbar zu machen. Diese Einschränkung ist normalerweise nur ein Problem, wenn der HTML-Code vom Benutzer zur Verfügung gestellt wird und es zum Zeitpunkt der Erstellung nicht möglich ist. –

Die dynamisch hinzugefügte Komponente kann von den anderen Komponenten zur Verfügung gestellt werden, sie müssen nicht in 'directives aufgeführt sein: [...]' –

hinzufügen Element mit Router dynamisch

Antwort

Verwandte Themen