Как привязать метод к компоненту Angular?

Question

Я использую дочерний компонент в шаблоне:

  <slide-panel
    (swipeleft)="onSwipeLeft($event)"
    (swiperight)="onSwipeRight($event)"
    [activePane]="isLeftVisible ? 'left' : 'right'">
</slide-panel>

Как вы можете видеть, я использую ввод activePane и передаю переменную isLeftVisible из родительского компонента.

Эта переменная измененаby:

 public onSwipeLeft(event: any) {
    this.isLeftVisible = true;
  }

  public onSwipeRight(event: any) {
    this.isLeftVisible = false;
  }

Я хочу сделать этот компонент изолированным и переместить все функции на onSwipeLeft, onSwipeRight внутрь.

Теперь дочерний компонент зависит от родительской переменной isLeftVisible.

Итак, везде, где я использую этот компонент, я должен создать isLeftVisible.

Могу ли я связать (swipeleft)="onSwipeLeft($event)", но переместить обработчик onSwipeLeft внутри компонента?

Answer 1

Вы можете использовать [EventEmitter][1]

Вы можете сделать это в ребенке:

@Output() open: EventEmitter<any> = new EventEmitter();

//in the method that creates the events you do

this.open.emit(//your parameters);

, а в своем отце вы делаете

<.... (open)="handleopenEvent(e)" ....>

и в отце.вы делаете:

public handleopenEvent(any:e){}