Hello, I am a beginner in the realm of angular2 and would appreciate any assistance in refining my vocabulary and terminology.
Currently, I have a class that consists of two directives structured as follows:
In parent.component.ts, the Parent component is comprised of both Foo and Bar
@Component({
selector: 'parent',
directives: [Foo, Bar]
...
template: require('./parent.html')
})
export class Parent {
...
}
In Foo.component.ts, we define the Foo directive
@Component({
selector: 'foo',
directives: [],
...
})
export class Foo {
...
browse() {
this.router.navigate(['/pages/somewhere', []]);
}
}
In Bar.component.ts, we define the Bar directive
@Component({
selector: 'bar',
directives: [],
...
})
export class Bar {
...
browse() {
this.router.navigate(['/pages/somewhere', []]);
}
}
In the HTML templates for both Foo and Bar, I aim to implement a click event (browse()) that performs the same action. While I currently have it functioning as described above, there appears to be redundant code within the definitions of both Foo and Bar which could potentially be consolidated within the Parent component
I am curious about how inheritance could be implemented in this scenario. Any advice or guidance would be greatly appreciated.