Angular在通过DOM元素调用它时找不到该函数

Question

我有一个奇怪的错误对我来说毫无意义。

TypeError: self.parent.context.toggleChecked is not a function

每当我点击一个我绑定了听众的项目时，我就会收到此错误。我现在正在使用正常的addEventListener而不是Renderer因为我有另一个组件我还没有改写过，但是这个例子不起作用（也不适用于Renderer）。

为什么它显然不能找到toggleChecked功能呢？如果我只是在不使用事件监听器的情况下调用它，它就可以工作。

这个错误意味着什么，我该如何解决？

export class FormCheckboxMultipleComponent implements OnInit, AfterViewInit {
  @Input() model: Array<any>;
  @Output('modelChange') onModelChange: EventEmitter<any> = new EventEmitter();
  @Output() callback: EventEmitter<any> = new EventEmitter();

  constructor(private _globals: GlobalVariablesService, private _renderer: Renderer, private _elementRef: ElementRef) {
    this.ns = _globals.ns;
  }

  ngOnInit() {
    this.model = this.model || [];
  }

  ngAfterViewInit() {

    let list = this._elementRef.nativeElement.getElementsByClassName('my-mom')[0];
    let options = list.getElementsByTagName('li');

    for (let option of options) {

      option.addEventListener('click', (e) => {
        this.toggleChecked(e);
      });
    }
  }

  toggleChecked(e) {
    console.log(e);
  }
}