2016-04-27 19 views
1

Ich versuche, eine Komponente in einer anderen Komponente zu laden, die eine eigene Ansicht hat. Die Komponente, die geladen wird, ist dynamisch und basiert auf bestimmten Bedingungen.Angular2 Komponente dynamisch innerhalb einer anderen Komponente ersetzen

Was ich meine, ersetzt eine andere Komponente an der gleichen Stelle innerhalb der übergeordneten Komponente.

Zum Beispiel möchte ich in meiner AppComponent.html (unten) Komponenten laden, die wieder durch eine andere Komponente mit einigen Ereignissen ersetzt werden können.

AppComponent.html

<button class="button1">Button1 </button> 
<button class="button2">Button2 </button> 
<placeHolder></placeHolder> 

AppComponent.ts

@Component({ 
    selector: '...', 
    templateUrl: 'resources/app.component.html' 
}) 
export class AppComponent{ 
    //on click of the button1, I want to load component c1, and on click of button2, I want to load component c2 
} 

(c1 und c2 sind nur eine andere Komponente)

Wie t o das tun? Jede Hilfe wird sehr geschätzt.

+0

Fügen Sie bitte Code hinzu, der zeigt, was Sie zu erreichen versuchen. –

+0

Günter - Auf den ersten Blick dachte ich, es wäre ein anderes Thema (http://stackoverflow.com/questions/36325212/angular-2-dynamic-tabs-mit-user-click-chosen-components), aber ich denke in Ihrer Antwort, wo Sie DynamicComponentLoader verwendet haben, werde ich mit diesem versuchen und hoffentlich wird das für mich arbeiten .. obwohl ich Änderungen vorgenommen habe, wie Sie für spezifischere Abfrage gefragt hatten. Hoffe das macht Sinn für dich. –

+0

Wenn Sie das ''-Tag laden und entladen wollen, dann sollte DCL (DynamicComponentLoader) das Richtige für Sie sein. –

Antwort

Verwandte Themen