각도 7 관측 가능.날짜별로 구독을 신청하시겠습니까?

각도 7 관측 가능.날짜별로 구독을 신청하시겠습니까?

'관측 가능'으로 반환된 정렬을 시도 중.데이터 구독 신청...각도 7에 새로 추가됨.여기서 RXJS 메소드를 어떻게 사용하는지, 무엇을 가져와야 하는지, 그리고 이벤트 유형의 배열을 어떻게 정렬해야 하는지 헷갈린다.

이벤트.ts

import {Venue} from './Venue';

export class Event {
  id: number;
  url: string;
  date: string;
  venue_id: number;
  venue: Venue;
}

EventResultObj.ts

import {Event} from './Event';

export interface EventResultObj {
  count: number;
  next?: any;
  previous?: any;
  results: Event[];
}

EventsService.ts:

import { Injectable } from '@angular/core';
import { HttpClient, HttpHeaders } from '@angular/common/http';
import { Event } from '../models/Event';
import {Observable} from 'rxjs';
@Injectable({
  providedIn: 'root'
})
export class EventsService {
  eventsUrl = 'http://localhost:4200/assets/tempData/events.json';
  constructor(  private http: HttpClient) { }

  getEvents(): Observable<EventResultObj> {    
    return this.http.get<EventResultObj>(this.eventsUrl).pipe(
          /// CANNOT FIGURE OUT HOW TO GET A SORT FUNCTION TO WORK HERE 
          /// WITH THE OBSERVABLE
    )
  }
}

EventsList.ts

import {Component, OnInit} from '@angular/core';
import {EventsService} from '../../services/events.service';

@Component({
  selector: 'app-buyer-events-list',
  templateUrl: './buyer-events-list.component.html',
  styleUrls: ['./buyer-events-list.component.scss']
})
export class BuyerEventsListComponent implements OnInit {

  constructor(private eventsService: EventsService) {
  }

  events;

  ngOnInit() {
    this.eventsService.getEvents().subscribe(events => this.events = events); // OR DO I ADD A PIPE OR MAP HERE AND HOW DO I DO IT?
  }

}

당신은 당신의 서비스에서 그것을 분류하고 컴포넌트에 가입해야 할 필요가 있을 것이다. 그래서 당신의 서비스는 다음과 같은 약간의 호킹이 있을 것이다.

 getEvents(): Observable<Event[]> {    
    return this.http.get<Event[]>(this.eventsUrl).pipe(
        map(events => events.sort((a, b) => new Date(b.date).getTime() - new Date(a.date).getTime()))
    ) ;
  }

그리고 나서,

 ngOnInit() {
    this.eventsService.getEvents().subscribe(events => this.events = events); 
  }

A를 추가할 것이다.map에서 직접 사건을 분류하다getEvents자네를 섬기는 데 도움이 될 거야이렇게 하면 서비스를 사용하는 모든 클래스가 이미 분류된 이벤트를 관찰할 수 있게 된다.

import { map } from 'rxjs/operators';

getEvents(): Observable<Event[]> {    
  return this.http.get<Event[]>(this.eventsUrl).pipe(
    map(events => events.sort((a: Event, b: Event) =>
      (new Date(a.date)).getTime() - (new Date(b.date)).getTime()
    ))
  );
}

서비스에서는 파이프와 지도를 사용한다!

public getEvents(): Observable<any> {
    return this.http.get(this.eventsUrl).pipe(map(response => response));

}

구성 요소에서 구독을 사용하십시오!

this.eventsService.getEvents()
 .subscribe(events => {
   console.log(events); // Example
 }, err => {
   throw err;
 });

여기 내 해결책이 있다.나는 수도꼭지 교환기를 사용할 것이다.

const  sortById = function(data) {
  data.sort((a,b) => data.id - data.id);
};


getEvents(): Observable<Event[]> {    
  return this.http.get<Event[]>(this.eventsUrl)
    .pipe(tap(sortById))
}   

참조URL: https://stackoverflow.com/questions/54725546/angular-7-sort-observable-subscribe-by-date