如何使用ionic2製作自定義元素組件？

我定義了一個登錄按鈕組件是這樣的：如何使用ionic2製作自定義元素組件？

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'); 
    } 
}

註冊它作爲app.module.ts供應商，然後在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>

沒有錯誤消息。構造函數被調用，但模板沒有填充到元素中。顯然缺少一個步驟。哪一個？

來源

2016-11-24 Michael

無需將其註冊爲provider，將其註冊爲declarations和entryComponents。 <login-button></login-button>（無需顯式導入）

來源

2016-11-24 12:25:30 Ivaro18

然後，瀏覽器，我得到的控制檯上：

然後按鈕可以與selector顯示「NO提供商LoginButton」 – Michael

嗯等待我只是檢查我的代碼，我在'NgModule'的'declarations'和'entryComponents'中聲明瞭'LoginButton'。在使用頁面上沒有導入聲明，只是使用選擇器標籤 – Ivaro18

最後一件事是它。我將它導入到使用的頁面中。把它拿走就行了。我也把LoginButton放到提供者列表中，這使得郵件「沒有LoginButton的提供者」消失;-) – Michael

如何使用ionic2製作自定義元素組件？

回答

相關問題