Angular2 Anzeige von Daten mit Vorlage basierend auf Routing

Question

Ich versuche, eine Seite mit Bildern zu erstellen, die mit einer anderen Vorlage verknüpft sind. Innerhalb dieser Vorlage zeige ich dann Daten basierend auf dem Bild an, auf das der Benutzer geklickt hat. Zum Beispiel ist es eine Firmenportfolioseite, es gibt eine Arbeitsseite mit nur Bildern, wenn der Benutzer auf ein Bild (Projekt) klickt, sollte es eine neue Vorlage laden und mit Interpolation die Daten für dieses Projekt anzeigen, dh: Projekttitel, Beschreibung, mehr Bilder usw.

Das würde mir ersparen, getrennte Seiten für jedes Projekt zu erstellen. Ich habe etwa drei Tage lang recherchiert, um eine Lösung zu finden, und ich denke, ich sollte einen Dienst nutzen.

Ich kann einfach nicht herausfinden, wie das Bild zu laden, um bestimmte Daten für das Projekt in der neuen Vorlage zu laden.

Answer 1

Sie eine Komponente mit Eingangsdaten verwenden:

@Component({ 
selector: 'poject-data', 
template: '...', 
}) 
export class ProjectDataComponent { 
    private contentUrl: SafeResourceUrl; 
    @Input() project: Project; 
    ... 
} 

und verwenden Sie es in Ihrer Hauptkomponente mit so etwas wie:

<project-data project="selectedProject" *ngIf="selectedProject != null"></project-data> 

Wo „selectedProject“ ein Feld Ihrer Hauptkomponente ist, dass Änderung bei Klick.