Angular2将函数参数传递给构造函数

Question

I'm trying to make some kind of @Component factory where I call a function that returns a component. And I want to pass the widgetName to the constructor or to the super constructor. How do I pass an argument to a constructor?

export function createCommonKendoComponent(selector: string, **widgetName**: string) {
    @Component({
        selector: selector,
        inputs: ['bound', 'role'],
        bindings: [ElementRef]
    })

    @View({ template: '<ng-content></ng-content>' })

    class CommonComponent extends KendoComponent {
        constructor(elementRef) {
            super(elementRef, **widgeteName**);
        }
    }

    return CommonComponent;
}

Answer 1

You add it as provider somewhere. Because a function doesn't have a type that can be used as provider you need to use a token. A token can be either a string or an OpaqueToken

var token = new OpaqueToken('myfunction');

bootstrap(AppComponent, [
    provide(token, 
        {useValue: (selector: string, **widgetName**: string) => { 
            createCommonKendoComponent(selector, **widgetName**}})]);

class CommonComponent extends KendoComponent {
    constructor(elementRef:ElementRef, @Inject(token) private compFactory) {
    }
}