Verweis auf eine Alias-Komponente in Angular 2

Question

Ich habe ein Problem in Ionic 2 konfrontiert. Ich würde eine neue Ansicht schieben, indem ich eine Referenz/Alias ​​ auf die Komponentenseite bekomme.

Auf meiner Elternklasse (SettingsPage), versuche ich eine neue Seite zu schieben:

<ion-item [navPush]="addon.settingsLandingClss"> 
    {{ addon.name }} 
    <ion-icon name="arrow-forward" item-right></ion-icon> 
</ion-item> 

Geordnete Klasse (SettingsPage) Typoskript:

import * as Mapping from '[...]'; 

export class SettingsPage { 
    public addon: Mapping.AddonMapModel; 
    constructor() { 
      this.addon = Mapping.AddonMap; 
    } 
} 

ich die Seite Komponente speichern als ' settingsLandingClss' Schlüssel:

// Importing page component 
import { MyComponentPage } from '...'; 

export interface AddonMapModel { 
    name: string, 
    settingsLandingClss: any 
} 

export const AddonMap = { 
    name: 'Test', 
    settingsLandingClss: MyComponentPage // <--- Reference to component page 
} 

Hinweis: Wenn ich MyComponentPage auf meinem übergeordneten Klasse zu importieren, es funktioniert ist.

Answer 1

Ich löste mein Problem durch die Instanziierung MyComponentPage durch seinen Namen.

Hier ist ein Beispiel (SettingsPage):

import * as SettingsLandingPages from '[...]'; 

addon.settingsLandingClss = SettingsLandingPages['nameofclass']; 

Und für SettingsLandingPages:

// Exporting all landing settings page 

export * from './mycomponent.page'; 

Für mehr Informationen und Beispiel: Plunker

Thx alle!