Как мне найти элемент с наивысшим идентификатором в моем Observable в Angular? - PullRequest
Новая
       53

Как мне найти элемент с наивысшим идентификатором в моем Observable в Angular?

1 голос
/ 01 августа 2020

Я новичок в изучении Angular и Typescipt, поэтому у меня небольшие проблемы. Я работаю над приложением, которое отображает список фотографий и позволяет нам создавать, редактировать и удалять уже существующие фотографии. При создании новой фотографии мне нужно найти уже существующий элемент с наивысшим идентификатором, увеличить на 1 и создать новый элемент с новым идентификатором, но я не знаю, как это сделать с помощью Observable возвращается из функции mu getPosts. Я использую данные из https://jsonplaceholder.typicode.com/photos. Я получаю все объекты фотографий с помощью функции ниже 

export interface Post {
  albumId: number,
  id: number,
  title: string,
  url: string,
  thumbnailUrl: string
}

--------------------

@Injectable()
export class PostsService {
  apiUrl = "https://jsonplaceholder.typicode.com/photos";

  constructor(private http:HttpClient){

  }

  getPosts(){
    return this.http.get<Post[]>(this.apiUrl);
  }
}

Есть ли способ сделать это с помощью существующей функции и Math.max.apply (). Кто-нибудь может мне помочь? Большое вам спасибо.

Ответы [ 2 ]

1 голос
/ 01 августа 2020

Давайте сделаем простую функцию, возвращающую сообщение с максимальным идентификатором (на самом деле это не обязательно, но сделает код немного чище): 

function findMax(list: Post[]): Post | undefined {
    if (!list.length) return undefined;
    return list.reduce((max, post) => post.id > max.id ? post : max )
}

Теперь давайте воспользуемся pipe () для преобразования результата из http-вызов с использованием нашей функции: 

getMaxPost(): Observable<Post | undefined> {
  return this.http.get<Post[]>(this.apiUrl).pipe(map(findMax));
}

Если вам действительно не важен пост с максимальным идентификатором и нужен только сам максимальный идентификатор, вы можете реализовать findMaxId(list) аналогично тому, что предложил @Harmandeep Singh Kalsi : 

findMaxId(list) {
  return Math.max(...list.map(post => post.id))
}
0 голосов
/ 01 августа 2020

У вас должен быть какой-то компонент, в котором вы подписываете результат API, например 

export class TestingComponent{

    maxId: number;
    constructor(postService: PostsService){}
    
    getPosts(){
    
       this.postService.getPosts().subscribe(data => {
           this.maxId=Math.max.apply(Math,data.map(obj => obj.id)); 
       })
    }
}

Другой способ, о котором я мог подумать, - сначала отсортировать массив на основе идентификатора и получить последний идентификатор, который будет максимальным id. 

this.posts = this.posts.sort((a,b) => a-b);
this.maxId = this.posts[this.posts.length-1].id;
...