扩展Angular2指令

Question

I am trying to extend the angular2-clipboard npm package. I need to get access to its ngOnInit() function and override it to suit a specific use case for copying.

I am new to angular2 and unsure how to do this, the way I've been trying it so far is linked in the plunker below. I am having difficulty since the package is exported as a module called ClipboardModule and I need the directive.

Here is the plugin github and plunker for reference:

1. Github: https://github.com/maxisam/angular2-clipboard
   • The file that shows the export is src/clipboard.module.ts
   • Their github also has a link to a plunker example of it working
2. My plunker: https://embed.plnkr.co/sIxmFo/

Answer 1

This is how one defines a service, not a directive.

@Injectable()
export default class CopyDirective extends ClipboardModule {
        public cm: any; // better way than any?

    constructor(cm: ClipboardModule) {
        super();
        this.cm = cm;
    }
}

A directive requires a @Directive() decorator instead of the @Injectable()

Inheritance with components, directives, and pipes isn't supported currently.

I also don't understand why you extend a module when you want to extend a directive. You need to extend the directive class directly.

See also https://github.com/angular/angular/issues/11606

Some scenarios can work though. Usually you need to repeat all decorators in the subclass.

@Component() , @Directive() , @Input() , @Output() , @ViewChild(ren)() , @ContentChild(ren)() . ...