使用继承将参数传递给角度为2/4的组件的基类的构造函数时出错

时间:2017-07-24 10:00:55

标签: angular oop typescript inheritance

我在typescript中使用带有angular 4的继承来从基类扩展派生类组件。但每当我尝试将变量/属性传递给我的基类构造函数并ngc编译项目时,它会给我一个错误 -

Can't resolve all parameters for BaseComponent in C:/path/src/components/base_component/base_component.component.ts

我的基类 -

export class BaseComponent {
    // Input values
    @Input() selectedOption: string;
    @Input() data : object;
    @Input() disabled : boolean;
    @Input() title: string;

    eventDetails : object = {
        type: 'onOptionChange',
        name: 'base_dropdown',
        value: '',
    };

    // Component output
    @Output() onOptionChange: EventEmitter<object> = new EventEmitter<object>();

    constructor(public eventName : any) {
        this.eventDetails["name"] = eventName;
    }
    ngOnChanges() {
        if(this.data && !this.selectedOption) {
            this.selectedOption = this.dropdownValue(this.data[0]);
        }
    }
    dropdownValue(option : any) {
        if(option.id == -1 ) {
            return option.name;
        }
        else {
            return option.id
        }
    }

    onModelChange(selectedOption : any) {
        console.log(this);
        console.log(this.eventDetails);

        this.eventDetails["value"] = selectedOption;
        this.onOptionChange.emit(this.eventDetails);
    }
}

我的派生类 -

@Component({
  selector: 'character-style-dropdown',
  template: `
        <base-dropdown
            [disabled]="disabled"
            [selectedOption]="selectedOption"
            [data]="characterStyleConfig"
            [title]="title"
            (onOptionChange)="this.onOptionChange.emit($event)">
        </base-dropdown>
    `
})

export class CharacterStyleDropdown extends BaseComponent {
    characterStyleConfig : object;
    title = "Character Style:";

    constructor (
        private getStyleListService : GetStyleListService
    ) {
        super("character_dropdown");
        this.getStyleListService.getStyles("getCharacterStyle")
        .subscribe(
            (styles : object) => this.characterStyleConfig = styles["styles"] ,
            (error : any) => console.log(error)
        );
    }
}

编辑:此外,这种继承方式适用于我将某个组件继承到其他组件的另一种情况。但在这种情况下,它失败了。是因为我将这个基本组件继承到其他7个组件中,但我在所有组件中都有super("string")。 是否有任何方法可能默认初始化构造函数的属性,所以它不必解析参数,以防我没有提供任何?

如何解决此错误?

1 个答案:

答案 0 :(得分:0)

试试这个:

 super(<any>"character_dropdown");