typescript - angular 4 bileşen kalıtımı ve "görünümü genişletme"

Angular'da bileşen mirasını şu şekilde yaptığınızda

export class ChildComponent extends ParentComponent{}

Tüm mantığı ParentComponent'ten alabilirsiniz, ancak tüm HTML'yi tekrar uygulamanız gerekir.

ParentComponent'imin HTML'i şöyle görünüyor

<div class="card">
    <div class="header"></div>
    <div class="content"></div>
    <div class="footer"></div>
</div>

Alt bileşen görünümünün yalnızca 'content' div'ini 'uyguladığı' yerde ebeveyn bileşeni 'uygulayabileceğim' bir yol var mı?

örneğin

@Component({
   template:`<div class="content-of-child">...</div>`
})
 export class ChildComponent extends ParentComponent{}

böylece sonuç şöyle olacaktır

<div class="card">
        <div class="header"></div>
        <div class="content-of-child"></div>
        <div class="footer"></div>
    </div>

Cevap #1

Hayır, böyle yapamazsınız ama yapabileceğiniz şey, üst bileşeninizi 3 bileşene bölmek ve sadece 'content' bileşenini genişletmektir. Ama bir kez daha, genişletilmiş bileşeni yerleştireceğiniz yeni bir üst bileşen oluşturmanız gerekecek.

İlgili makaleler