错误 AOT 构建自定义组件装饰器 - Angular 5

Question

我已经构建了一个自定义组件装饰器，如此处所述Inheritance of Angular 5 components with overriding the decorator properties。

    import { Component } from '@angular/core';

    export function ExtendedComponent(extendedConfig: Component = {}) {
        return function (target: Function) {
            const annotations = target['__annotations__'] || [],
                  parameters = target['__paramaters__'] || [],
                  propMetadata = target['__prop__metadata__'] || [];

            if (annotations.length > 0) {
                const parentAnnotations = Object.assign({}, annotations[0]);

                Object.keys(parentAnnotations).forEach(key => {
                    if (parentAnnotations.hasOwnProperty(key)) {
                        if (!extendedConfig.hasOwnProperty(key)) {
                            extendedConfig[key] = parentAnnotations[key];
                            annotations[0][key] = '';
                        } else {
                            if (extendedConfig[key] === parentAnnotations[key]){
                                 annotations[0][key] = '';
                            }
                        }
                    }
                });
            }

            return Component(extendedConfig )(target);
        };
    }

使用中：

    @ExtendedComponent({
        selector: 'app-auto-complete',
    })
    export class AutoCompleteComponent extends AutoComplete {

        constructor() {
            super();
        }

        ngOnInit() {
        }
    }

它在开发模式下完美运行，但是当我尝试构建它时，我收到以下错误：

    ERROR in : Can't bind to 'suggestions' since it isn't a known         property of 'cds-auto-complete'.
    1. If 'cds-auto-complete' is an Angular component and it has 'suggestions' input, then verify that it is part of this module.
    2. If 'cds-auto-complete' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.
    3. To allow any property add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component. ("...

我尝试添加 CUSTOM_ELEMENTS_SCHEMA 和 NO_ERRORS_SCHEMA，但没有帮助。关于解决方案的任何想法？

Answer 1

像这样的自定义装饰器在 AOT 中不起作用，因为编译器正在寻找具有 @Component 装饰器的类。要解决此问题，您还必须将 @Component() 装饰器添加到类中（并在自定义装饰器中删除 Component(extendedConfig)(target)）：

@Component({...})
@ExtendedComponent({
    selector: 'app-auto-complete',
})
export class AutoCompleteComponent extends AutoComplete {}

但我认为这有点违背了扩展组件的目的。

你可以看到完整的 github 问题here。这不是完全相同的问题，但它是相同的原因