Can I extend an Angular 2 component without declaring the template every time

Question

I have the following plunker . It is fairly straight forward, however, now I would like to take advantage of TS Inheiratence so I create another constructor like this...

constructor(items: Array<NavItem>){
  this.items = items;
  console.log("New Route Called")
}

So I would like to do something like this...

@Component({
  selector: "my-other-component"
})
export class MyOtherComponent extends App{
  constructor(){
    super([new NavItem("Other Test 1", "/test/1")]);
  }
}

I tried something like this but couldn't get it working ...

But then I have to import the template multiple times which I would like to avoid.

Answer 1

The code is correct. It just seems like the code order matters for plnkr... I've moved App to the beginning and it works. https://plnkr.co/edit/LukRyJ9OrzguyQlsgXxT?p=preview

You don't have to repeat your class properties definitions, so I've removed them too. Also it's good to know that you can have one constructor in App class with an optional parameter:

constructor(items?: Array<NavItem>)

But then I have to import the template multiple times which I would like to avoid.

The only things which are not inherited are decorators (both class and method), so you basically need to copy them from the parent class. No way to get around... Hope it helps.