Gibt es eine Möglichkeit, von angular2-Komponenten zu erweitern/zu erben?angular2 Komponente erweitern, aber Vorlage beibehalten
Sagen wir (der Einfachheit halber) Ich habe eine Button
Komponente. Basierend auf dieser Komponente möchte ich es auf eine RedButton
Komponente erweitern, aber benutze die gleiche Vorlage und die gleichen Initialisierungsmethoden, aber ändere nur, was passiert, wenn der Benutzer die Taste drückt. Wie ist das möglich? Hier
ist, was ich versucht, so weit:
button.component.ts
import {Component, View} from 'angular2/core';
@Component({
selector : 'my-button'
})
@View({
template : '<button (click)="clicked()">Click</button>'
})
export class ButtonComponent {
constructor() {
}
public clicked(event) {
console.log('Base clicked');
}
}
redbutton.component.ts
import {Component, View} from 'angular2/core';
import {ButtonComponent} from './button.component';
@Component({
selector : 'my-redbutton'
})
// typescript complaints here, that RedButton needs a View and template
export class RedButtonComponent extends ButtonComponent {
constructor() {
super();
}
public clicked(event) {
console.log('RED clicked');
}
}
app.component.ts
import {Component} from 'angular2/core';
import {ButtonComponent} from './button.component';
import {RedButtonComponent} from './redbutton.component';
@Component({
selector: 'coach-app',
directives : [ButtonComponent, RedButtonComponent],
template: '<h1>Button Test App</h1><my-button></my-button><my-redbutton></my-redbutton>'
})
export class TestAppComponent { }