2016-06-22 5 views
0

デフォルトのhtml buttonタグを拡張するカスタムbutton要素を作成したいとしましょう。イオン2成分をバイパスしてデフォルトのhtmlタグを使用する

マイcomponent多かれ少なかれ、次のようになります。

@Component({ 
    selector: 'my-button', 
    styles: [] 
    template: `<button><ng-content></ng-content></button>` 
}) 
export class MyButton{} 

問題ではなく、通常のHTMLボタンの、私はionic2ボタンを取得することです。どのように私はイオン2ボタンのコンポーネントをバイパスし、自分自身を作成することができますか?

答えて

0

anchor要素で試しましたか?

<a class="my-button"><ng-content></ng-content></a> 

といくつかデフォルトボタンこれらのようなスタイル(またはあなたがそれに適用するスタイル):

a.my-button { 
    align-items: flex-start; 
    text-align: center; 
    cursor: default; 
    color: buttontext; 
    border-image-source: initial; 
    border-image-slice: initial; 
    border-image-width: initial; 
    border-image-outset: initial; 
    border-image-repeat: initial; 
    background-color: buttonface; 
    box-sizing: border-box; 
    padding: 2px 6px 3px; 
    border-width: 2px; 
    border-style: outset; 
    border-color: buttonface; 
    padding: 1px 6px; 
    text-rendering: auto; 
    color: initial; 
    letter-spacing: normal; 
    word-spacing: normal; 
    text-transform: none; 
    text-indent: 0px; 
    text-shadow: none; 
    display: inline-block; 
    text-align: start; 
    margin: 0em 0em 0em 0em; 
    font: 13.3333px Arial; 
} 
関連する問題