Comment créer un composant d'élément personnalisé avec ionic2?

Question

Je définir un composant connexion bouton comme ceci:

import { Component } from '@angular/core'; 

@Component({ 
    selector: 'login-button', 
    template: 
    `<ion-buttons end> 
     <button ion-button round (click)="openLogin()"> 
     Login 
     <ion-icon name="arrow-up"></ion-icon> 
     </button> 
    </ion-buttons> 
    <ng-content></ng-content> 
    ` 
}) 

export class LoginButton { 

    constructor() { 
    console.log('Hello LoginButton'); 
    } 
} 

enregistrer en tant que fournisseur dans app.module.ts puis l'utiliser dans un fichier html:

<ion-content padding> 
</ion-content> 
<ion-footer> 
    <ion-navbar> 
    <button ion-button icon-only menuToggle> 
     <ion-icon name="menu"></ion-icon> 
    </button> 
    <ion-title> 
     Fragen 
    </ion-title> 

    <login-button></login-button> 
    </ion-navbar> 
</ion-footer> 

Aucun message d'erreur. Le constructeur est appelé, mais le modèle n'est pas rempli dans l'élément. De toute évidence, une étape est manquante. Laquelle?

Answer 1

Pas besoin de l'enregistrer comme provider, enregistrez-le sous declarations et entryComponents.

Ensuite, le bouton peut être affiché avec le selector: <login-button></login-button> (pas besoin d'importer explicitement)