我们可以遍历Angular 2中用@Output()装饰的所有EventEmitter吗答案

【问题标题】：Can we iterate over all EventEmitter decorated with @Output() in Angular 2我们可以遍历Angular 2中用@Output()装饰的所有EventEmitter吗
【发布时间】：2016-06-08 15:08:21
【问题描述】：

我想要实现的是对于给定的组件实例，我想遍历所有用@Output 装饰的EventEmitter。

例如

我的组件

   @Component({
     moduleId: module.id,
     selector: "my-component",
     template: "<h1>My Component!!"
   })
   export class MyComponent{ 
     @Output() emitter1: EventEmitter<any> = new EventEmitter<any>();
     @Output() emitter2: EventEmitter<any> = new EventEmitter<any>();
   }

假设我正在动态加载这个组件，如下所示，

   this._cr.resolveComponent(MyComponent).then(cmpFactory => {
        this.testComponentContainer.clear();
        let instance: any = this.testComponentContainer.createComponent(cmpFactory).instance;

        // Here I want to iterate over EventEmitter dynamically
        // So that I may bind to both emitter1 and emitter2
    });

我可以这样做吗？提前致谢！！

【问题讨论】：

标签： angular typescript1.8 reflect-metadata

【解决方案1】：

您可以查看propMetadata 元数据以找出修饰后的输出。

这是一个示例：

this._cr.resolveComponent(MyComponent).then(cmpFactory => {
    this.testComponentContainer.clear();
    let instance: any = this.testComponentContainer.createComponent(cmpFactory).instance;

    var propMetadata = Reflect.getMetadata('propMetadata', MyComponent);
    var outputs = propMetadata.filter(metadata => {
      return (metadata instanceof OutputMetadata);
    });

    outputs.forEach(output => {
      output.subscribe(event => {
        // handle event
      });
    });

    // Here I want to iterate over EventEmitter dynamically
    // So that I may bind to both emitter1 and emitter2
});

Madhu Ranjan 更新 上面的代码有问题，但是它提示我要正确使用它，如下所示，

   this._cr.resolveComponent(componentToTest).then(cmpFactory => {
        this.testComponentContainer.clear();
        let instance: any =   this.testComponentContainer.createComponent(cmpFactory).instance;

        let propMetadata: any = Reflect.getMetadata('propMetadata', componentToTest);
        let outputs: any = [];

        for (let key in propMetadata) {
            if (propMetadata.hasOwnProperty(key)) {
                if (propMetadata[key].length > 0) {
                    let _hasOutput = propMetadata[key].filter(metadata => {
                        return (metadata instanceof OutputMetadata);
                    });

                    if (_hasOutput && _hasOutput.length > 0) {
                        outputs.push(key);
                    }
                }
            }
        }

        outputs.forEach(output => {
            instance[output].subscribe(event => {
                // Logic to use event data..
            });
        });
    });

【讨论】：