Как наблюдать события DOM в Angular2 с помощью RxJS?

Question

Я использую Angular2 Alpha 46. У меня есть компонент списка, как показано ниже. Я хочу наблюдать за событиями щелчка с кнопок PREV и NEXT и вызывать веб-API через обещание получить данные и обновить список.

Я не знаю, должен ли я использовать EventEmitter, который поставляется с Angular2 или RxJS, как это.

Может ли кто-нибудь представить пример?

Answer 1

Я не полный пример, но я могу набросать для вас решение:

В вашем шаблоне привязки к событию щелчка

<button (click)="next()">Next</button> 
 
<button (click)="prev()">Prev</button>

В вашем классе (я думаю, вы используете машинопись) define next() и prev()

import {Http, Headers, HTTP_BINDINGS} from 'angular2/http'; 
 

 

 

 
next() { 
 
    this.http.get("your url") 
 
    .map(res => res.json()) /* if its JSON */ 
 
    .subscribe(
 
     data => this.listdata = data, 
 
     err => console.error(err), 
 
     () => console.log("Done") 
 
    ) 
 
    } 
 

 
prev() { 
 
    /* like next */ 
 
    }

Вы должны импортировать Http и HTTP_BINDINGS.

http.get возвращает наблюдаемый (так называемый поток) не обещание, как в угловой 1

Существует видео учебник от Ayden Towfeek, который показывает, как работать с HTTP и наблюдаемыми на YouTube tutorial