Angular 2繼承組件

Question

我有一個basewindow.component，它將成爲我所有組件的基礎組件。這basewindow.component將有像保存，刪除等按鈕，同時點擊「新建」按鈕，我想調用basewindow函數ufbNew()後執行它應執行父窗口功能ufNew()。請檢查我的代碼，並幫助我是否正確地做到了這一點。我能夠調用基函數，但父母不

//basewindow.component/// 


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

@Component({ 
    selector: 'basewindow', 
    templateUrl: './Basewindow.component.html', 
    styleUrls: ['./Basewindow.component.css'] 
}) 
export class BasewindowComponent { 

/////////////////////// User Base Functions /////////////////// 

    ufbNew() { 

     this.ufNew(); 
    } 
    ufbSave() { 
     this.ufSave(); 
    } 

    /////////////////////// User Functions for parent /////////////////// 

    ufNew() { 
     alert("I m In Base ufbNew") 
    } 
    ufSave() { 
    } 

} 


//// Basewindow.component.html 

<div class="container"> 
    <h1>Hero Form</h1> 
    <form> 
     <div class="form-group"> 

      <button (click)="ufbNew()">New</button> 
      <button (click)="ufbSave()">Save</button> 

     </div> 

    </form> 
</div> 


/////////////////////////// AccountsCategory.Component (Parent 1) //// 



import { Component } from '@angular/core'; 
import { BasewindowComponent } from '../base/basewindow.component'; 

@Component({ 
    selector: 'app', 
    templateUrl: './AccountsCategory.component.html' 
}) 
export class AccountsCategory extends BasewindowComponent { 


    /////////////////////// User Functions for parent /////////////////// 
    ufNew() { 
     alert("I m in Acounts category (parent)")  
    } 
    ufSave() { 
    } 
} 


//////////// AccountsCategory.component.html ///////////// 

<basewindow> </basewindow> 

我的目的是重用基礎組件對象，功能和要求，如果從孩子覆蓋。 請參見plnkr測試應用

https://plnkr.co/edit/bVxt4GjNXwIg7pDbR4sE?p=preview

Answer 1

使用此

abstract class Animal { 
    //OTHER STUFF 

    abstract ufSave(): void; 

    //OTHER STUFF 
}