typescript - Extending component decorator with base class decorator -
i have several component decorator declarations repeat on every component, example:
@component({ moduleid: module.id, directives: [bootstrapinputdirective] }) how can apply these declarations components? tried create base class decorator , extend other classes base class decorations doesn't seem apply derivative classes.
@component decorator. means handles class applies on adding metadata data leveraging reflect-metadata library. angular2 doesn't metadata on parent classes. reason, it's not possible use decorators on parent classes.
regarding bootstrapinputdirective directive, define platform one. way wouldn't need include each time directives attribute of components.
here sample:
(...) import {platform_directives} 'angular2/core'; bootstrap(appcomponent, [ provide(platform_directives, {usevalue: [bootstrapinputdirective], multi:true}) ]); edit
yes, create own decorator implement this. here sample:
export function customcomponent(annotation: any) { return function (target: function) { var parenttarget = annotation.parent; delete annotation.parent; var parentannotations = reflect.getmetadata('annotations', parenttarget); var parentannotation = parentannotations[0]; object.keys(parentannotation).foreach(key => { if (ispresent(parentannotation[key])) { annotation[key] = parentannotation[key]; } }); var metadata = new componentmetadata(annotation); reflect.definemetadata('annotations', [ metadata ], target); } } the customcomponent decorator used way:
@component({ template: ` <div>test</div> ` }) export class abstractcomponent { } @customcomponent({ selector: 'sub', parent: abstractcomponent }) export class subcomponent extends abstractcomponent { } note need provide parent class input of decorator since can find out parent class within decorator. prototype of class metadata applied on class , not on associated prototype reflect-metadata.
edit2
thanks nitzam's answer, here improvment:
export function customcomponent(annotation: any) { return function (target: function) { var parenttarget = object.getprototypeof(target.prototype).constructor; var parentannotations = reflect.getmetadata('annotations', parenttarget); var parentannotation = parentannotations[0]; object.keys(parentannotation).foreach(key => { if (ispresent(parentannotation[key])) { annotation[key] = parentannotation[key]; } }); var metadata = new componentmetadata(annotation); reflect.definemetadata('annotations', [ metadata ], target); } } there no need parent attribute reference parent class in custom decorator.
see plunkr: https://plnkr.co/edit/ks1ik41sibflydb4athg?p=preview.
see question:
Comments
Post a Comment