Добавьте слушателя к настраиваемому наблюдаемому компоненту в Nativescript

Question

Я пытаюсь, чтобы мой пользовательский компонент уведомлял своих пользователей о выборе, но у меня возникают проблемы с получением события.

Домашний компонент использует пользовательский компонент FavouriteListComponent:

home.component.ts

export class HomeComponent implements AfterViewInit, OnDestroy {

    @ViewChild('favouriteList', { read: ElementRef }) fl:ElementRef;
    private favouriteCourses: FavouriteCoursesComponent;

    ...

    ngAfterViewInit(): void {
        this.favouriteCourses = <FavouriteCoursesComponent> this.fl.nativeElement;
        this.favouriteCourses.on('selected_course', function(course_id) {
            console.log("on");
            this.tabsComponent.gotoNewGame(course_id);
        });
        console.log("ngAfterViewInit");
    }

    ngOnDestroy(): void {
        this.favouriteCourses.off("selected_course");
    }

}

home.component.html

    <GridLayout row="4">
        <ns-favouritecourses #favouriteList></ns-favouritecourses>
    </GridLayout>

favouritecourses.component.ts

@Component({
  selector: 'ns-favouritecourses',
  ...
})
export class FavouriteCoursesComponent extends Observable implements OnInit {

  ...

  playCourse(courseId: number): void {
    console.log("notifying...");
    this.notifyPropertyChange('selected_course', courseId);
  }

}

В журнале я вижу событие, отправляемое через «notify», но оно никогда не принимается моим слушателем, хотя слушатель кажется добавленным нормально, хотя, вероятно, нет.

Как отправить событие с FavouriteListComponent на HomeComponent?

Answer 1

Вы должны просто использовать генератор событий и подписаться на событие, где это необходимо.

HTML:

  <ns-favouritecourses (selected_course)="changed(this)" #favouriteList></ns-favouritecourses>

TS:

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

  changed(value : any){
    this.Change.emit(value);
  }