如何在一个可观察的查找和移动项目到集合的顶部

Posted 2021-04-18

Rxjs的新手。我熟悉管道，过滤器，排序，地图等但不能解决这个问题。我需要在我的可观察返回数据中找到一个项目，并在显示之前将其移动到顶部。在这个例子中，Darth Vader是第4项，我想找到并移动到可观察数组/集合中的第0位或第1位。 https://stackblitz.com/edit/findandmakefirst

答案

像这样？

people$ = this.http.get('https://swapi.co/api/people/')
  .map((res:any) => {
    var _vader = res.results.splice(res.results.findIndex(x => x.name === 'Darth Vader'), 1);
    return [..._vader, ...res.results];
  });

另一答案

import { People } from './sw-people.model';

interface Results {
  count: Number,
  next: String,
  previous: string,
  results: People[],
}

@Injectable()
export class SwPeopleService {
    people$ = this.http.get('https://swapi.co/api/people/')
      .map((res: Results) => {
         return res.results.sort((a: People, b: People) => {
           return a.name === "Darth Vader" ? -1 : b.name === "Darth Vader" ? 1 : 0;
         });
        });

    constructor(private http: HttpClient) {} 
}