Sometimes I use Mixins to inject repeated functions like slugUrl().
But it doesn't work with angular 4 compiler.
export function Mixin(decorators: Function[]) {
return function (classFn: Function) {
decorators.forEach(decorator => {
Object.getOwnPropertyNames(decorator.prototype).forEach(name => {
classFn.prototype[name] = decorator.prototype[name];
});
});
};
}
@Mixin([BehaviorInjected])
export class FooComponent {
}
If I compile this code, compiler throws:
Property 'ngClassControl' does not exist on type 'FooComponent'.
Any ideas?
Edit: Since there was someone who asked, here's another example using TS mixins that reproduces the issue, this time at template level.
Components:
@Component({
selector: 'home-page',
template: '<test [tag]="tag"></test>'
})
export class HomePageComponent extends TaggedComponent(MyComponent) {
public tag = 'hi there';
}
@Component({
selector: 'test',
template: '<div></div>'
})
export class TestComponent extends TaggedComponent(MyComponent) {}
Mixins:
type Constructor<T> = new(...args: any[]) => T;
export function TaggedComponent<T extends Constructor<{}>>(Base: T) {
class TaggedBase extends Base {
@Input() tag: string;
};
return TaggedBase;
}
export class MyComponent {
protected subscriptions: Subscription = new Subscription();
// ...
}
Error:
ERROR in Error: Template parse errors: Can't bind to 'tag' since it isn't a known property of 'test'. ("][tag]="tag">")