可观察的角度EventEmitter

Question

我正在尝试与EventEmitter一起使用Angular 7进行观察：

Documentation

但是他们提供的代码会引发错误。

StackBlitz

angular docs给出的相同代码：

<zippy (open)="onOpen($event)" (close)="onClose($event)"></zippy>

@Component({
  selector: 'zippy',
  template: `
  <div class="zippy">
    <div (click)="toggle()">Toggle</div>
    <div [hidden]="!visible">
      <ng-content></ng-content>
    </div>
  </div>`})

export class ZippyComponent {
  visible = true;
  @Output() open = new EventEmitter<any>();
  @Output() close = new EventEmitter<any>();

  toggle() {
    this.visible = !this.visible;
    if (this.visible) {
      this.open.emit(null);
    } else {
      this.close.emit(null);
    }
  }
}

抛出错误：ERROR Error: _co.onClose is not a function

Answer 1

需要在onOpen中实现onClose和AppComponent方法

export class AppComponent  {
  name = 'Angular';

  onOpen($event) {
    console.log('onOpen', $event);
  }

  onClose($event) {
    console.log('onClose', $event);
  }
}